Jean Polkin Posted August 24, 2022 Share Posted August 24, 2022 hi everybody, i saw an animation in an other topic and i tried to change direction to get the reveal of the colorish boxes horizontally but in my case it doesn't work. could you please help me to achieve this. Big thanks in advance See the Pen xxWeqpG by JPolkin (@JPolkin) on CodePen Link to comment Share on other sites More sharing options...
akapowl Posted August 24, 2022 Share Posted August 24, 2022 Hello Jean. If all you want to behave different is that the images change their width on scroll instead of their height, then all you'd need to change is that exact property in the tween responsible for that. // this... .fromTo(image, { width: () => { return "100%" } }, { width: () => { return "0%" } }) //...instead of this .fromTo(image, { height: () => { return "100%" } }, { height: () => { return "0%" } }) See the Pen vYRMJZy by akapowl (@akapowl) on CodePen But I also wouldn't recommend using the approach from the codepen you probably 'forked' your demo from as it is technically flawed and not 100% correct. The other thread you already posted in does for one contain a corrected version (although using GreenSock's ScrollSmoother instead of smooth-scrollbar.js for the smooth-scrolling)... ...and another approach, likely more comprehensive, following the suggestion by Blake in that same thread. I hope this will help. 1 Link to comment Share on other sites More sharing options...
GreenSock Posted August 24, 2022 Share Posted August 24, 2022 One other approach, but you may need to tweak the timing: See the Pen VwXNMjr?editors=1010 by GreenSock (@GreenSock) on CodePen 2 Link to comment Share on other sites More sharing options...
Jean Polkin Posted August 24, 2022 Author Share Posted August 24, 2022 thanks a lot guys you're awesome! 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