ChunkyApps
Content Type
Profiles
Forums
Store
Blog
Product
Showcase
FAQ
Downloads
Posts posted by ChunkyApps
-
-
My own solution was to get rid of the repeat in the timeline and do a check at the end of the animation. If scrollY is 0 I restart the timeline. It works but I'd still like a timeline repeatIf function.
Or better yet, use ScrollTrigger to cancel the timeline animation and hide the element so I don't have to wait until it plays to the end.
tlScrollArrow = gsap.timeline() .to('#scroll-1', {opacity: 1, duration: 0.3}) .to('#scroll-1', {y: 20, duration: 2, ease: 'power1.out'}, 0.1) .to('#scroll-1', {opacity: 0, duration: 1.5}, 0.4) .add( function() { if (window.scrollY == 0) { tlScrollArrow.restart() } })
-
I have an infinitely repeating timeline that I wish to stop once the user scrolls the page. This seems like it should be easy but I'm stumbling here.
Any ideas?
Cancel timeline on first scroll
in GSAP
Posted
Thank you. Always the simplest answer that eludes me. Or the urge to use ScrollTrigger for everything lol!