feyberho Posted January 3, 2022 Share Posted January 3, 2022 sorry im very new in gsap. so i want anyone to help me with my request 1. make my linked menu move to a section 2. make my codepen tobe an infinity scroll See the Pen qBPYZdw by feyberho (@feyberho) on CodePen Link to comment Share on other sites More sharing options...
Cassie Posted January 3, 2022 Share Posted January 3, 2022 Hey there! The scrollTrigger demos page is a great place to start looking. ☺️https://greensock.com/st-demos Here's an infinite scroll example - See the Pen WNQmvPK by kdbkapsere (@kdbkapsere) on CodePen And here's an example showing how to use the scrollTo plugin to navigate to a section See the Pen bGVjLwG?editors=0010 by GreenSock (@GreenSock) on CodePen 1 Link to comment Share on other sites More sharing options...
feyberho Posted January 3, 2022 Author Share Posted January 3, 2022 (edited) thank you @Cassie for quick response. and im sorry that i cannot understand all the code of gsap. i mean i just see on code pan and just copy paste it in my codding panel. 😅 but let me see first about scrollTo plugin you gave.. ok my bad. its already working well after i change gsap version to the newest. Edited January 3, 2022 by feyberho test the code she gave Link to comment Share on other sites More sharing options...
feyberho Posted January 3, 2022 Author Share Posted January 3, 2022 no idea after try this solution. its seems my code not work or i confuse to put the right code. so i try to make my website works using this reference https://www.ssk.com/ Link to comment Share on other sites More sharing options...
Cassie Posted January 3, 2022 Share Posted January 3, 2022 Hey @feyberho, I'm afraid it's out of the scope of these forums to provide complete copy-paste solutions. We're happy to help you learn though. If you're new to GSAP, try to start from scratch rather than copy and pasting, write your own code and break it down one little bit at a time, make sure you understand what each bit is doing. If you have a specific question about something you've tried to understand, we're here to help. The docs are very thorough and there are also videos to explain things if you learn better from videos than reading. Link to comment Share on other sites More sharing options...
Cassie Posted January 3, 2022 Share Posted January 3, 2022 No one, not even very experienced developers look at a brand new API or library and immediately understand it. It takes time to read, question, research and learn. If you put that time in I think you'll find it enjoyable. Good luck! Link to comment Share on other sites More sharing options...
feyberho Posted January 3, 2022 Author Share Posted January 3, 2022 1 minute ago, Cassie said: Hey @feyberho, I'm afraid it's out of the scope of these forums to provide complete copy-paste solutions. We're happy to help you learn though. If you're new to GSAP, try to start from scratch rather than copy and pasting, write your own code and break it down one little bit at a time, make sure you understand what each bit is doing. If you have a specific question about something you've tried to understand, we're here to help. The docs are very thorough and there are also videos to explain things if you learn better from videos than reading. alright then @Cassie thanks for reply me so fast. btw, where can i found the explanation video? please mention the link. Link to comment Share on other sites More sharing options...
Cassie Posted January 3, 2022 Share Posted January 3, 2022 What would you like an explanation video on? There are a lot of them on different topics. Here's the getting started article - that has a video. There's also a video at the top of the scrollTrigger docshttps://greensock.com/docs/v3/Plugins/ScrollTrigger There's no video for scrollTo but if you have any questions we're here!https://greensock.com/docs/v3/Plugins/ScrollToPlugin Link to comment Share on other sites More sharing options...
OSUblake Posted January 3, 2022 Share Posted January 3, 2022 And here's a demo that loops like the site you referenced. See the Pen XWeJXVz by GreenSock (@GreenSock) on CodePen Link to comment Share on other sites More sharing options...
feyberho Posted January 3, 2022 Author Share Posted January 3, 2022 47 minutes ago, Cassie said: What would you like an explanation video on? There are a lot of them on different topics. Here's the getting started article - that has a video. There's also a video at the top of the scrollTrigger docshttps://greensock.com/docs/v3/Plugins/ScrollTrigger There's no video for scrollTo but if you have any questions we're here!https://greensock.com/docs/v3/Plugins/ScrollToPlugin just finished watching all the video you mention. also i think i can understand little bit about gsap. but i have to rewatch the video more and more. thank you so much @Cassie 1 Link to comment Share on other sites More sharing options...
feyberho Posted January 3, 2022 Author Share Posted January 3, 2022 46 minutes ago, OSUblake said: And here's a demo that loops like the site you referenced. wow @OSUblake this is really helpful. but i think when i set menu link its not working. hehe. thank you so much sir 1 Link to comment Share on other sites More sharing options...
feyberho Posted January 4, 2022 Author Share Posted January 4, 2022 @OSUblake Pardon me sir, but i'm difficult to link my section. can you give me the example from this reference how to move to another section with href or scrollToPlugin? See the Pen XWeJXVz by GreenSock (@GreenSock) on CodePen Link to comment Share on other sites More sharing options...
OSUblake Posted January 4, 2022 Share Posted January 4, 2022 It doesn't look like you added anything to demo. Give it a shot. It's should be no different than the examples on the ScrollToPlugin docs. 1 Link to comment Share on other sites More sharing options...
feyberho Posted January 6, 2022 Author Share Posted January 6, 2022 On 1/4/2022 at 11:30 PM, OSUblake said: It doesn't look like you added anything to demo. Give it a shot. It's should be no different than the examples on the ScrollToPlugin docs. sorry for late reply @OSUblake here the mini-demo i just added scroll to plugin follow trought the scrollTo Puglin with button. any advice to make it to be menu not by button but by <a> / href link? i mean i want to force the section going to a section with scrollToPlugin with just Href="#sectionid" please se my mini demo: it worked but in random direction when it clicked. Link to comment Share on other sites More sharing options...
feyberho Posted January 6, 2022 Author Share Posted January 6, 2022 1 hour ago, feyberho said: sorry for late reply @OSUblake here the mini-demo i just added scroll to plugin follow trought the scrollTo Puglin with button. any advice to make it to be menu not by button but by <a> / href link? i mean i want to force the section going to a section with scrollToPlugin with just Href="#sectionid" please se my mini demo: it worked but in random direction when it clicked. i want the when i clicked the Section 1 it moved like this codepen but just in ScrollToPlugin function: See the Pen kDvmC by bassta (@bassta) on CodePen Link to comment Share on other sites More sharing options...
Solution OSUblake Posted January 6, 2022 Solution Share Posted January 6, 2022 I would probably make each section a separate part of a timeline, and placed using labels. Then you scroll to a spot in that timeline using labelToScroll. See the Pen GRMGPBz by GreenSock (@GreenSock) on CodePen 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