junta Posted July 30, 2011 Share Posted July 30, 2011 I am trying to use yoyo and I am having an issue. When you rollover the button the yoyo effect starts but if I rollout and then roll back over before the tween is done the yoyo animation gets screwed up. I assume I need some sort of code that says let the tween finish, but I am not really sure where to start with it. Here is my code below...thanks for the help! Wiggle_JFR_Btn.onRollOver = function(){ TweenMax.to(this, .1, {_x:311, yoyo:5}); } Link to comment Share on other sites More sharing options...
Carl Posted July 31, 2011 Share Posted July 31, 2011 hi junta. in order to see the tween play back and forth you need to: specify how many times the tween should repeat and in addition set yoyo to true (default is false) Your tween should look like this: TweenMax.to(this, .1, {_x:311, repeat:5, yoyo:true}); ----- however that is not going to prevent things from getting a bit screwy if you rollover your button multiple times in quick succession. every time you rollover your button a new tween is going start. if you need help with that let us know. Carl Link to comment Share on other sites More sharing options...
junta Posted July 31, 2011 Author Share Posted July 31, 2011 Thanks Carl, it did seem like I wasn't doing the YoYo correct. I am still confused about how I stop the tween from acting crazy when rolling in and out though. Can you point me in right direction to correct this? Thanks Link to comment Share on other sites More sharing options...
Carl Posted August 1, 2011 Share Posted August 1, 2011 please explain the exact behavior you wan your buttons to have on roll over and roll out. should the tween stop on roll out? should the tween re-start if already in progress on roll over? thx Link to comment Share on other sites More sharing options...
junta Posted August 1, 2011 Author Share Posted August 1, 2011 I was thinking that onRollOver the tween would complete even onRollOut. I am not sure what visually would be best when you roll back over. Not sure if it would be better to let the original tween finish or to restart it. So I would be open to either way. Thanks again Link to comment Share on other sites More sharing options...
Carl Posted August 1, 2011 Share Posted August 1, 2011 here is how you would make sure 1:the tween continues even after you roll off 2:the tween will not re-start if it is currently tweening import com.greensock.*; mc.onRollOver = function() { if (TweenMax.isTweening(mc) == false) { //the mc isn't tweening so tween it TweenMax.to(this,.5,{_x:300, repeat:5, yoyo:true}); } }; just a few pointers. there aren't too many situations where moving the object you rolled over away from the mouse is a great idea, primarily because that will instantly trigger a roll out. with the back and forth movement that you desire it would be very difficult to have the tween seamlessly rewind back to the beginning when you roll out AND if you did there would be a high likelihood that the object would pass under the mouse and just start another roll over tween again. the code given above is probably the safest implementation of a roll over that moves an object back and forth. although its quite possible that when the tween is finished another roll over will trigger and it will keep going and going and going. Link to comment Share on other sites More sharing options...
junta Posted August 1, 2011 Author Share Posted August 1, 2011 Thank you for the tips. I tried the code and nothing change for me. When you first rollover it and rollout and roll back over before the tween ends, the sliding motion shortens..basically the image doesn't slide all the way to the x coordinate. If you do it again even after letting the tween finish, the motion gets even shorter. Eventually rolling over the button doesn't trigger any tween at all. Do you have any thoughts on this? Thank you for your time once again! Link to comment Share on other sites More sharing options...
Carl Posted August 1, 2011 Share Posted August 1, 2011 did you update the mc instance name to reflect the instance name of your button? i wasn't clear about that. you could probably use this as well. import com.greensock.*; mc.onRollOver = function() { if (TweenMax.isTweening(this) == false) { //the mc isn't tweening so tween it TweenMax.to(this,.5,{_x:300, repeat:5, yoyo:true}); } }; Link to comment Share on other sites More sharing options...
junta Posted August 2, 2011 Author Share Posted August 2, 2011 That seemed to work. The first time I tried the code I used the instance name and not "this", would that have effected it at all? Maybe I just didn't type out the code correctly the first time, I am not sure. Thanks for the help Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now