Nikhil009 Posted March 25, 2020 Share Posted March 25, 2020 Hi, Is there any way to achieve this type of animation while scrolling. Im getting confused on the part where when if you scroll down new text-1 appear from bottom and current text-2 exit to up and reverse when scroll back up text-2 appears from top and text-1 exits bottom https://www.apple.com/nz/ipad-pro/ The above is part of the section whereby when you scroll up the content fades down and when you scroll down content fades up Similar to the above website, please kindly help me. Thank You Link to comment Share on other sites More sharing options...
ZachSaucier Posted March 25, 2020 Share Posted March 25, 2020 Hey Nikhil. That website just has their timeline attached to the scroll bar's progress. You can see the basic technique here: See the Pen BaNPoEK?editors=0010 by GreenSock (@GreenSock) on CodePen 3 Link to comment Share on other sites More sharing options...
Nikhil009 Posted March 25, 2020 Author Share Posted March 25, 2020 Hi Zach, Ahhhh i see i see, it gets confusing whenever i try use scroll animation especially the calculations, offset top, scroll top, outer height , inner height, still catching up on that but I am slowly understanding the concept behind what you sent. But i think im making it look more complicated than it seems because im confusing myself, but will learn. Thank Very Very Much again 🙂. 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