Hi, I'm having trouble getting this to work, so I'm wondering if anyone can help?
Basically, I'm creating a TimelineMax instance and populating it with some tweens.
One of the tweens I'm using to set a div at exactly the window height and another at exactly 0 (cleaned up to make it more generic):
tl.to(selectors.$myElement, 0, posObj({ display: 'block', y: $(window).height(), z: 0.001}), "myLabel");
The problem is that the div heights are being resized on browser resize, so that two divs stacked up on each other no longer butt up against each other. I tried approaching it by looping through the tl.getChildren, finding tweens with a "y" var, then updating that number with the new window height, but this doesn't seem to be working as expected.
var updateTweens = function () {
tl.getChildren().map(function ( item) {
if(item.vars["y"]){
if(item.vars["y"]==windowHeight){
item.vars["y"]=$(window).height();
}
}
}); };
So is there a better way to accomplish this? Bear in mind that I have around 30 tweens to work with and when I tried to use the "tl.add(var myTween=new TweenMax(el, time, vars));" approach everything sort of broke.
But any help is greatly appreciated.