uzisky Posted July 25, 2020 Share Posted July 25, 2020 Hello, first timer and a newbie here. I've been trying to create a vertical Marquee that scrolls vertically with pauses at interval that works exactly like this: https://www.jqueryscript.net/demo/Flexible-jQuery-Vertical-News-Ticker-Plugin-Advanced-News-Ticker/# But I've been hitting a road block. Your help is appreciated. See the Pen ZEGNpGq by enuzo (@enuzo) on CodePen Link to comment Share on other sites More sharing options...
ZachSaucier Posted July 25, 2020 Share Posted July 25, 2020 Hey uzisky and welcome to the GreenSock forums. What road block are you hitting? Side note: We recommend using yPercent instead of y: some percent. You can read about why in the most common GSAP mistakes article: 1 Link to comment Share on other sites More sharing options...
uzisky Posted July 25, 2020 Author Share Posted July 25, 2020 Hello @ZachSaucier, thanks for your response. The problem is how to have the items scroll vertically in a seamless loop and how to make each item pause for lets say 2 seconds, then scroll to the next item, then pause again ...on and on just like the first example on this page. This is what the current code code looks like: var tl = gsap.timeline(); tl.to(".item", {y: "-=50", duration: 2}); I tried this: var tl = gsap.timeline(); tl.to(".item", {y: "-=50", duration: 2, repeat: -1, repeatDelay: 2}); and this without successes: var tl = gsap.timeline({repeat: -1, repeatDelay: 2}); tl.to(".item", {y: "-=50", duration: 2}); Link to comment Share on other sites More sharing options...
uzisky Posted July 25, 2020 Author Share Posted July 25, 2020 I'm also trying out the yPercent in place of y: since it's the recommended way to do it. It doesn't solve the problem though. Link to comment Share on other sites More sharing options...
mikel Posted July 25, 2020 Share Posted July 25, 2020 Hey @uzisky, Just another approach See the Pen xxZeVag by mikeK (@mikeK) on CodePen Happy tweening ... Mikel 1 1 Link to comment Share on other sites More sharing options...
uzisky Posted July 25, 2020 Author Share Posted July 25, 2020 1 hour ago, mikel said: Hey @uzisky, Just another approach Happy tweening ... Mikel Wow, thanks Mikel! Exactly want I want. I really need to dig into GSAP. Link to comment Share on other sites More sharing options...
GowthamK Posted December 2, 2021 Share Posted December 2, 2021 On 7/26/2020 at 1:10 AM, mikel said: Hey @mikel This is great, can you please help to achieve this on scroll. Link to comment Share on other sites More sharing options...
GreenSock Posted December 2, 2021 Share Posted December 2, 2021 @GowthamK if you'd like some help, please provide a minimal demo. Attaching an animation to scroll is very easy with ScrollTrigger - see the ScrollTrigger docs. 👍 Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now