Search the Community
Showing results for tags 'seamlessloop'.
Found 2 results
-
.thumb.jpg.508ba629559fba639e5f03a505c5b072.jpg)
Seamless loop direction change on scroll is not working infinitely
codechirag posted a topic in GSAP
I was looking for marquee on scroll direction change example and thanks to this wonderful community I got it, I saw many threads for similar thing and one of them worked for me but I have little difference in my example, I have used helper function to make infinite and also for two opposite direction simultaneously. In my snippet the directions are working fine but it stops after sometimes and also at some points I found initially both were going in one direction. I request corrections from experts. Thanks a lot. -
Hey, a quick one. When using the HorizontalLoop / SeamlessLoop (https://gsap.com/docs/v3/HelperFunctions/helpers/seamlessLoop) helper function, the reversed option doesnt change anything. My example code: // ... React useEffect code surrounding this. const logos = logoRefs.map((ref) => ref.current); const loop = horizontalLoop(logos, { reversed: true, // Doesnt work speed: 1, // Works paused: false, // Works repeat: -1, // Works }); const performanceTimeline = gsap.timeline({ scrollTrigger: { trigger: main.current, start: 'top bottom', end: 'bottom top', scrub: true, onEnter: () => loop.play(), onLeave: () => loop.pause(), onEnterBack: () => loop.play(), onLeaveBack: () => loop.pause(), }, }); Im expecting my marquee to animate to the right vs to the left which its currently doing. As im writing this it turns out the timeline causing the reverse to not work - specifically the onEnter etc.Why is this effecting the ability to reverse? Im pausing for performance reasons (offscreen = paused, onScreen = play) Kapture 2024-01-09 at 12.49.53.mp4
