rctneil

@akapowl Thanks! Just as you replied, I found an example online that actually did just what we were after. Isn't it always the case that you find a decent example just after you've posted asking for help!? The page we have has 210 items in a vertical timeline. ScrollTrigger does appear to be working perfectly but we think that due to the sheer number of items on the timeline, the page performance is not great. I realise Scroll Trigger has to do all its measurements etc. We have used IntersectionObserver to lazy load the images by taking the "data-src" attribute of our img tag and setting it to be the "src" attribute when the image enters the view. This has helped a little but not massively. Is there anything you could recommend in regards to this? We were potentially thinking about some form of overlay that covers everything until loading has completed. Any suggestions as to how to could do this? Thanks, Neil

Hello, We are building a vertical timeline with timeline items positioned left and right alternately. All the items are blurred by default. We wish to sharpen them up as they are scrolled past a certain point. We are wondering if ScrollTrigger can be used for this scenario? If so, are there any examples of similar things you could show us? The blur / unblur is performed just by a class change right now. We have written this so far without GSAP but wondering if it can help us as we are getting confused managed the trigger points and also activating the first item on page load when one or possibly two items are positioned above the trigger line. Many thanks, Neil

So i'm assuming that there's no GSAP property that effectively says "remove any positioning added by GSAP", equalling the return to default values? It seems weird to have to measure the initial values so use them later when a removal of the added properties SHOULD achieve the same effect. Am I missing something?

Hi Zach, Thanks for replying. I'll try to take those notes onboard as I tweak my animation. I understand I can just set them to the same values as I have set in my CSS but I hate repeating stuff when it's been specified already. Basically, i'd rather just have something that can say "use the originally specified values from CSS before GSAP modified them". This way, if the CSS original positions change then the final end state of my animation updates with no changes. I hate repeating code when i'm sure there must be a way but just not sure of the actual solution. Then again, there may not be. I don't know. I really hope we can find a resolution. Thanks, Neil

Hi, I'm working on a small animation that has 3 states and snaimates between them. The 3rd animation should animate the circles back to their original top and left postion as specified in the CSS. Can anyone help me figure out how to do that? Also any suggestions about how to improve this animation? This is my first time using GSAP. Thanks, Neil