Vivek_appscrip Posted September 11, 2020 Share Posted September 11, 2020 I am trying to achieve something like initially on page load there will be a header on user user scrolls down the initial header should hide and a new header should slide down. i have done this using animate css and plain js. but this works smoothly only when the user scroll is smooth. when the user scrolls the page very fast the header slidedown faces some glitchs so i want to use scrolltrigger to achieve this. may i know how to achieve this. Link to comment Share on other sites More sharing options...
ZachSaucier Posted September 11, 2020 Share Posted September 11, 2020 Hey Vivek and welcome to the GreenSock forums. Your request is actually quite broad. Do you want the animation to be gradual as the user scrolls down or should the whole animation play once a certain point is reached? Should the animation reverse when going the opposite direction? A minimal demo of your issue would be very helpful if you'd like our help debugging. Maybe this demo can help you out in the mean time: See the Pen mdVyPvK by GreenSock (@GreenSock) on CodePen Link to comment Share on other sites More sharing options...
Vivek_appscrip Posted September 11, 2020 Author Share Posted September 11, 2020 Hi.. Thanks for the quick response. Yes the second header which is hidden by default and it will be comes down gradually as user scrolls Link to comment Share on other sites More sharing options...
Vivek_appscrip Posted September 11, 2020 Author Share Posted September 11, 2020 Yes the second header should hide and first should shown when the user scrolled up i.e top 0 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