Sougata Posted December 28, 2024 Posted December 28, 2024 Please help me . I couldnt fix this . See the Pen RNbZVyQ by sougataghar47 (@sougataghar47) on CodePen.
GSAP Helper Posted December 28, 2024 Posted December 28, 2024 We'd love to help, but vague details like 'it's broken' or 'it doesn't work' are very difficult for people to help with. Here are some tips that will increase your chances of getting a relevant answer: A clear description of the expected result - "I am expecting the purple div to spin 360degrees" A clear description of the issue - "the purple div only spins 90deg" A list of steps for someone else to recreate the issue - "Open the demo on mobile in IOS safari and scroll down to the grey container" A minimal demo - if possible, using no frameworks, with minimal styling, only include the code that's absolutely necessary to show the issue. Please don't include your whole project. Just some colored <div> elements is great. Would you mind clarifying your question please and making sure that you include a minimal demo that illustrates the problem so that we can help you?
Sougata Posted December 28, 2024 Author Posted December 28, 2024 2 hours ago, GSAP Helper said: We'd love to help, but vague details like 'it's broken' or 'it doesn't work' are very difficult for people to help with. Here are some tips that will increase your chances of getting a relevant answer: A clear description of the expected result - "I am expecting the purple div to spin 360degrees" A clear description of the issue - "the purple div only spins 90deg" A list of steps for someone else to recreate the issue - "Open the demo on mobile in IOS safari and scroll down to the grey container" A minimal demo - if possible, using no frameworks, with minimal styling, only include the code that's absolutely necessary to show the issue. Please don't include your whole project. Just some colored <div> elements is great. Would you mind clarifying your question please and making sure that you include a minimal demo that illustrates the problem so that we can help you? https://www.btsbioengineering.com here is the link to the website , I want to replicate the same vertical slider
Sougata Posted December 28, 2024 Author Posted December 28, 2024 Just now, Sougata said: https://www.btsbioengineering.com here is the link to the website , I want to replicate the same vertical slider Just now, Sougata said: https://www.btsbioengineering.com here is the link to the website , I want to replicate the same vertical slider See the Pen RNbZVyQ?editors=1111 by sougataghar47 (@sougataghar47) on CodePen. here is what I have done so far
Rodrigo Posted December 29, 2024 Posted December 29, 2024 Hi, It's the weekend, please be a bit more patient in getting a response 🙏 Instead of creating a ScrollTrigger instance and pinning the same element multiple times, just create a Timeline, with a single ScrollTrigger instance and pin the entire section just once, as shown in these demos: See the Pen wvZqwyg by GreenSock (@GreenSock) on CodePen. See the Pen wvYVjvb by GreenSock (@GreenSock) on CodePen. Hopefully this helps Happy Tweening! 1
Sougata Posted December 29, 2024 Author Posted December 29, 2024 3 hours ago, Rodrigo said: Hi, It's the weekend, please be a bit more patient in getting a response 🙏 Instead of creating a ScrollTrigger instance and pinning the same element multiple times, just create a Timeline, with a single ScrollTrigger instance and pin the entire section just once, as shown in these demos: See the Pen See the Pen wvZqwyg by GreenSock (@GreenSock) on CodePen. by GreenSock (@GreenSock) on CodePen See the Pen See the Pen wvYVjvb by GreenSock (@GreenSock) on CodePen. by GreenSock (@GreenSock) on CodePen Hopefully this helps Happy Tweening! Hi , so I got some lil help from chat gpt but I dont like the white space it creates , I tried pinSpacing but then it overlaps .can you please look into it ? I did use timeline See the Pen RNbZVyQ by sougataghar47 (@sougataghar47) on CodePen. here is the codepen
Rodrigo Posted December 30, 2024 Posted December 30, 2024 Hi, Again please don't post asking to get help, you posted on a Sunday morning, so you can expect that some delay in getting an answer, but you will get an answer. Also you have to consider time zone differences. The main issue here is the way pin spacing works and the fact that your sections' height is not 100% of the screen height, so you get that extra space after the element you're pinning. In order to avoid that you have to wrap all those section in a common parent and pin that parent element as show in these demos: See the Pen qBLRzVX by GreenSock (@GreenSock) on CodePen. See the Pen ZEVpqjb by GreenSock (@GreenSock) on CodePen. Here is a fork of your demo: See the Pen MYgEjpr by GreenSock (@GreenSock) on CodePen. Hopefully this helps Happy Tweening! 1
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