Streaming live at 10am (PST)

While Scrolling in View bug?

I have some ‘while scrolling in view animations’ on a site header. Although I have it set to only trigger on desktop, for some reason the initial scroll action set at 0% (for example, say -100px) is applied to the elements on all the other resolutions so throws the whole design out. I thought that if you set it to only display on desktop all instances of the animations were ignored on other resolutions?

Here is my read only…

EDIT* I’ve had to move on with this design now so have disabled the animation for now.

Any help much appreciated.

This is something that is an old known problem. As far as I can tell it can not be addressed due to the way initial state is handled. In short initial state is always transferred and executed by elements (resulting in will-change state for a given element) even if subsequent animation is not firing.

1 Like

Thanks for the heads up dram.

It’s interesting because I took the idea I have used from one of the marketplace templates (one of Deni’s amazing designs) and he has it working as expected. I have scoured his work-flow and replicated it exactly but still can’t get it to work.

1 Like

Can you please link the template in question? I am very much interested to know how it was done too :slight_smile:

I know, it’s fascinating and intriguing and also starting to make me twitch. It’s this one…

https://preview.webflow.com/preview/muma-template?utm_source=muma-template&preview=ea111495a0624f29cfdc7740f7bc5215

…and it’s homepage 4.

Alright, I officially have no idea how the will-change property was avoided in that template. Maybe someone will chime in with thoughts on this one.

:rofl: I know right.

He’s actually got the will-change property to display a top property of 0.333 on ipad and 0.666 on mobile. How? when the animation is switched off on anything other than desktop.