Search the Community
Showing results for tags 'batch'.
Hi, I have had this issue in multiple sites where I am using scrolltrigger and animating the y property. This is what happens on an <a> tag for example (see screenshot). I have had this issue also appear on normal <div> that have border properties. I have also tried to replace the border with outline for example but same thing happens. When I hover over it, the border corrects itself and looks fine after that. Also when you change some properties through "inspect element" in chrome for example. The error also occurs in Microsoft EDGE, but have not seen it in
I'm trying to figure out how to target the element within a batch process on scrollTrigger. In my simple example, I have a script that is using scrollTrigger to look for all elements with a particular class. When it comes into view, I'm toggling a class to change the color. I want to be able to possibly run other functions on that element as well. For example, I may want to add another class to it. Or, I may want to delay it based on a data attribute. But, I can't seem to figure out how to get each target element. I tried "this", I tried "this.target". I tried $(this). For
GSAP 3.4 has arrived with some significant improvements to ScrollTrigger like: Accommodating different setups for various screen sizes, like a mobile version and desktop version - ScrollTrigger.matchMedia() Batching and staggering elements that enter the viewport, similar to what's often done with IntersectionObserver - ScrollTrigger.batch() Integrating with smooth scrolling libraries - ScrollTrigger.scrollerProxy() ScrollTrigger.matchMedia() You can use standard media queries to seamlessly transition between different ScrollTriggers. It's surprisingly simple to set