Search the Community
Showing results for tags 'scolltrigger'.
Hello Greenshock forums! I love all of your products and want to thank you for creating and maintaining them. I don't normally post for help unless I've exhausted my options and would appreciate if anyone can help or even give me some pointers. I am trying to achieve this functionality where I have an x number of sections that the user scroll through. Most sections are 100vh like presentation slides but some are going to be longer in height. As the user scrolls the sections pin themselves and animate which works pretty well so far. However when the sections are longer I need them to pin for longer and scroll until the content inside them scrolls to the end. Because one codepen is equal to 1000 words here is what i am trying to achieve: https://codepen.io/riginosk/pen/291e78b4557bcf4a022d094ffea85163 Thank you!
Hi fantastic people of Greensock! I'm a big fan, and a shockingly green member. I'm wrapping my head around ScrollTrigger, and I'm trying to achieve an effect like the one here: https://www.easytigerfilms.fr/en/actualites My codepen demo only deals with one image for now. I've pinned the images so the basic overlay effect works when scrolling down, but when I scroll up (logically), the translation occurs backwards. I'm stuck there: I don't know if I should use disable()/enable(), create two triggers, toggle classes.. I would like the active image to stay fixed in the frame while the following image translates on top, no matter if it comes from above or below. If you have any idea of how I could get there and what I'm missing, that would be highly appreciated! Kindly, Hugo.
Below is a great example of a scroll indicator using ScrollTrigger. What I am curious about is how would you make the scroll indicator only work for a specific div or section height rather than the entire page/document height?