[What class is this site using to scroll?]

It looks to be TweenLite. Check out the function:

 

movePanel:function(e,t,n){  
  //lots of jQuery     
   TweenLite.to($(".main-container"), u, { css: { marginTop: r }, ease: site.slideEase, onComplete: function () {});

}

 

 

 

Hope that helps. Matt

[Updating CSS Attribute of a Tween]

The add() issue has been resolved, the issue was infact that I was using an older version of TimelineMax (TimeLineMax VERSION: beta 1.641).  Thank you for this information, I should have looked closer.

[Updating CSS Attribute of a Tween]

Thank you for the help on this jQuery matter. I believe my implementation is pretty close to the appropriate use, but to be sure I'll provide a snippet.  Also, something to note, this is being used on a Drupal site, I don't think it matters, but I thought I would include it.

 

My usage:

 

var elements = {
   $elementOne : $('#jQueryOne'),
   $elementTwo : $('#jQueryTwo')
};

var gsTweens = {
   one: "",
   two: ""
};

var tl = new TimelineMax({paused:true});
gsTweens.one = TweenLite.to(elements.$elementOne, time, {css:{top: -50px}});
tl.add(gsTweens.one, "label");

//later on

tl.remove(gsTweens.one);
gsTweens.one = TweenLite.to(elements.$elementOne, time, {css:{top: -100px}});
tl.add(gsTweens.one, "label");

 

The error I get from the console log is:

Uncaught TypeError: Object [object Object] has no method 'add'

 

As for removing and the tween and re-adding it to the timeline, this looks like the perfect solution, however I am wondering if I replace a tween that has already been played with a new tween with new values, can I execute this new tween in the timeline by moving backwards through the timeline or will this not work?

 

I appreciate it.

[Updating CSS Attribute of a Tween]

This is excellent, thank you very much for the help and for the JSFiddle demo. I think this is exactly what I need.  I also appreciate the clarification on my misuse of the labels on the timeline as this will help me down the road.

I was also wondering about the TimelineMax function add(), I've tried to use this function before when jQuery is loaded (jQuery-1.8.0) and it looks like jQuery thinks the timeline object is trying to reference the jQuery function add().  Has anyone else had problems with this?

 

The jQuery add function:

http://api.jquery.com/add/

 

Matt

[Updating CSS Attribute of a Tween]

I am using TimelineMax for a project and I was wondering is there was a way to possibly update the CSS attribute of a Tween by calling it's label?

 

For example my tween would look like:

 

var tl = new TimelineMax({paused:true});
tl.to(element, time, {css:{top: -50px}}, "my-label");

 

 

I would like to possibly call this tween by it's label and update the CSS property to a new value.

I tried something like this, but I had no success.

tl.removeLabel("my-label");
tl.insert(TweenLite.to(element, time, {css:{top:-100px}}), "my-label");

 

 

Any help would be appreciated.

 

 

[Window Re-size]

Thank you very much for the help.  It came down to it that I was, as you pointed out, using the remove() function incorrectly.  I appreciate the help.

[Window Re-size]

I was wondering about the best way to handle a jQuery resize event when a user resizes the browser window.  I am using TimelineMax and currently I am pausing the timeline, moving it to the very start of the timeline and then removing the timeline object, initializing a new one and rebuilding the timeline each time the browser resize event is fired.  I was thinking there might be a better way to do this.  I found this answer on StackOverflow here.

Having said that, this solution works, but it moves the timeline to the start every time.  If I try and resize the window and pause the timeline at the current time of the label it gets thrown off?  If I simply try and remove the timeline and rebuild it with a new object, it gets thrown off also?

I had seen something about a liquid stage?  Is this available on the JS version, or maybe there is something I am overlooking?

 

Here's my resize code:

 

     

$window.on('resize', function(){	
    var time = 0;
    if(globalLabel != "")
         time = controller.tl.getLabelTime(globalLabel);
    //time would be used to pause the timeline but it does not work
    clearTimeout(id);
    controller.tl.pause(0,true); 
    controller.tl.remove();
    //on the Update view call, I am creating a new timeline object 
    //and rebuilding the timeline
    id = setTimeout(controller.UpdateView, 150);
});

 

 

I appreciate any help.