kwastaras

@GreenSock thank you very much for the ideas and help!

@GreenSock sorry for that, I understood now that I wanted to do literally the same. I've edited my message. Just on load, when bottom toolbar is visible, the window.innerHeight is smaller and initial scrollTriggers are calculated based on that smaller height, and I want to somehow calculate them as if toolbar is already hidden ( highest possible innerHeight on load)

Hi Jack! It resolved the part of the problem, thank you... Can I detect on window load somehow, the window.innerHeight incluging the moving bottom toolbar? (it's visible on load)

Hi, I did a page with scrolltrigger pinning and other effects, but on iphones it isn't working well because of bottom toolbar, that moves bottom 'scrolltrigger' and my '.pinSpacer' got repositioned... I tried ScrollTrigger.normalizeScroll() but it doesn't seem to work. We are looking for a person that can troubleshoot it Thanks for your time

Hello @GreenSock ! the page is just too big; I can't create a minimal demo. What I'm interested in is whether ScrollTrigger.normalizeScroll() should work 100% on all iOS devices with a bottom toolbar? If the bottom iOS toolbar breaks all triggered points, what alternative approach to animation can I try instead? ( Right now, due to the bottom toolbar, my pinSpacer's 'top' attribute is changing on scroll up and down, causing the fixed elements to be repositioned slightly. )

Hi! ScrollTrigger.normalizeScroll() doesn't work on some ios devices, on some new iphones (iphone 12) it worked but caused 'jumpinness' when scrolling, on older ones (iPhone 7, XS) it broke my page, is there some rule of how to better apply it? Thank you very much for your work!

@Cassie thank you very much, will-change:transform didn't work for <circle> element, I've rebuild animation with simple divs for iphone

@Rodrigo thank you so much! transformOrigin centers them when scaling, but when I use now scaling instead of changing radius, I have even more lags on mobiles, can I send you link to an actual website where this animation is used? maybe there are just too much circles and it's impossible to animate it ...

I have an animation of <circle> elements inside <clipPath>, I need to scale them, so that initial position stays the same (scale from center), I can only achieve it by changing 'r' attribute, but on IOS devices it looks laggy, on android and windows all works great. I thought I can fix it by changing the 'transform:scale()' attribute instead of 'r', and giving the circle 'will-change:transform', but when I change 'transform' instead of 'r', initial position 'cx' and 'cy' changes. Is there a way I can optimize animation of 'r' attribute on IOS devices? Would be thankful of any help...

I did this transitions with gsap, but the problem is, that on a laptop trackpad (touchpad) or mobile swipe, if you do a "long swipe", scroll event can last up to 2-3 seconds, so page continue to scroll even after animation played. I've read that scroll event cannot be interrupted... Would be very grateful for some idea how to solve this... ( p.s i don't want to use library "fullpage js", because after this few slides a website needs to have normal smooth-scrolling behavior ) i found this similar thread and there seems to be no solution to this problem ?

thank you! in make case this code worked gsap.to(window, { scrollTo: smoother.offset(section, "0 0"), duration: 0.3, ease: Power4.easeOut }),

Hello! I saw in docs there is only 3 options for ScollSmoother.scrollTo( target, smooth ( true or false ), and position). How can i specify the duration and easing of scrollTo() ?

Hi, can you give me some tips please how i can hide the plugins when setting website live, so all of the users can't download it? What if a client for whom i do a website, will download those plugins and will use them later in his projects for free?