Jump to content


tween variable overwrite

Moderator Tag

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

I come from actionscript tweenLite, and I was wondering if you still could overwrite the variable to change the tween like in actionscript like so:


var myTween=tweenLite.to(object,1,{left:"10px"});


What I would like is a mouseover animation, but a different one mouseout animation (not just reversing the tween).


Here's what I have now:


var bot0 = $("#tapa0");

clipTween40 = TweenLite.to(bot0, .2, {top:"-192px", backgroundColor:"rgba(172, 221, 255,.85)", ease:Cubic.easeOut, paused:true});

bot0.parent().mouseenter(function() {clipTween40.play();});  
bot0.parent().mouseleave(function() {clipTween40.reverse();});

Maybe by overwriting the tween...

I've tried without much success.




Link to comment
Share on other sites

Hmm since you are binding these tweens to mouseevents, and don't want a single play/reverse tween, you may be better off just creating your tweens on the fly. That way if you mouseleave while the mouseenter tween is playing (and vice versa) the starting values for the tween will be calculated from their current values, keeping everything smooth.


Do you think running something like this could work for you?:

var bot0 = $("#tapa0");

bot0.parent().mouseenter(function() {
    TweenLite.to(bot0, .2, {top:"-192px", backgroundColor:"rgba(172, 221, 255, .85)", ease:Cubic.easeOut})

bot0.parent().mouseleave(function() {
    TweenLite.to(bot0, .2, {top:"0px", backgroundColor:"rgba(0, 0, 0, 1)", ease:Cubic.easeIn})
Link to comment
Share on other sites

I suppose it could work, but it duplicates tween calls.

I'll give it a try and let you know.



Link to comment
Share on other sites

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 account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.