Solution Solution Share Posted June 20, 2021 Are there any methods of creating a vertical carousel, with the selected item fixed in the center of the screen? I've tried something based on this project, but the results have been unsuccessful. Found alternatives on the forum, codepen didn't give any results either Modifiers Plugin for Infinite Image Carousel - GSAP - GreenSock Link to comment Share on other sites More sharing options...
Share Posted June 20, 2021 Hey @marsi, Welcome to the GreenSock Forum. You can find a number of examples on the GSAP ScrollTrigger page. For example this one: https://codepen.io/GreenSock/details/RwKwLWK Does it help? Happy tweening ... Mikel 2 Link to comment Share on other sites More sharing options...
Author Share Posted June 20, 2021 Thank you, your answer makes a great contribution to solving my question, but I would like to know if there are any code examples with vertical card display? Link to comment Share on other sites More sharing options...
Share Posted June 21, 2021 9 hours ago, marsi said: I would like to know if there are any code examples with vertical card display? What's wrong the example @mikel linked to? Vertical behavior would be the exact same, just in a different direction. You just need to modify the code so it works on the y axis instead of the x axis. 1 Link to comment Share on other sites More sharing options...
Author Share Posted June 21, 2021 Yes, thank you, it all worked out, if anyone needs an example of a vertical carousel: See the Pen KKWYRrE by irtexfree (@irtexfree) on CodePen 1 Link to comment Share on other sites More sharing options...
Share Posted June 21, 2021 Hey @marsi, How about this? See the Pen yLMrwrK by mikeK (@mikeK) on CodePen Happy scrolling ... Mikel 5 Link to comment Share on other sites More sharing options...
Share Posted August 26, 2022 Hi, i try to use the same function, but unfortunately the scroll/next/prev actions are always regarding to the body. If i want to implement it inside div on a page, it always scrolls if the body scroll, and the body jumps up and down, if i click the next or prev button. Is there a way to reduce this animation only inside a div? Link to comment Share on other sites More sharing options...
Share Posted September 23, 2022 Was following all the codepen example above but looks like all of them have this same weird issue, could be something broke from recent gsap update? I have replicated the codepen in our project and has the similar issue Link to comment Share on other sites More sharing options...
Share Posted September 24, 2022 Might be related to this: Link to comment Share on other sites More sharing options...
Share Posted September 26, 2022 Yes indeed, I believe that's fixed in the upcoming release which you can preview at: GSAP: https://assets.codepen.io/16327/gsap-latest-beta.min.js ScrollTrigger: https://assets.codepen.io/16327/ScrollTrigger.min.js Sorry about the confusion! Let us know if you still see any problems with the beta files in place. Link to comment Share on other sites More sharing options...
Share Posted September 27, 2022 GSAP 3.11.2 is officially live and should resolve this issue. The CDN may take a little extra time to update, but Github, NPM, and the file downloads are all updated now. 🥳 1 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