ejlee

I have a timeline which looks like this below this.tl = new TimelineMax({paused: true}) this.tl.to(this.images[this.count], this.duration, { y: '0%', force3D: true, ease: new Ease(BezierEasing(1, 0.055, 0.015, 0.985))}) this.tl.to(this.images[this.count], this.duration, { y: '-100%', force3D: true, delay: 1, ease: new Ease(BezierEasing(1, 0.055, 0.015, 0.985)),clearProps: 'y'}) this.tl.restart() What i'm trying to achieve is to pause all animation that happens on this timeline, and any animation that is currently running on this "this.tl" timeline. I have tried to use this.tl.pause() This pauses the animation, however if there is an animation already running it doesn't pause that. Is there a pauseAll for the timeline? I know I can use this code below, but I do not want to use it because this pauses all globally and it affects my other tweens. TweenMax.pauseAll()

Thanks guy! That was the problem. I didn't have visibility :hidden on the css.

On my site, I am using a plugin inView, which calls a function when an element has come into view in the page. There is a div in the middle of the page, and i'd like to use this to fade in it and come from the bottom TweenMax.from(element, 1.5, { autoAlpha: 0, y: 100, ease:Expo.easeOut }) The thing is it works, however if I quickly scroll down to this div, I'll see it for a millisecond, a quick flash....and then the effect starts. I tried to use the .set function and set it to autoAlpha: 0...however now it doesn't even fade in at all. Is there a solution to this problem? I'd like to use .from, however I do not want to see it flash quickly on the page before it starts the animation.