Streaming live at 10am (PST)

Glitchy on scroll interaction

Hello all,

I am creating an animated hero section for a church’s website.

This mainly involves raising and lower the opacity of different elements as you scroll down thru the first div. As you can see it starts with an image of a camera lens, zooms “inside” the lens, and then 3 different images and titles will sequentially fade in.

Within the interaction live preview mode, everything is smooth, but on the live site it is super buggy. I assume the way I structured the elements and created the interaction is not ideal. Can someone help point me in a better direction to build this in a cleaner way that won’t be buggy?

Any help is much appreciated.

Be Blessed,

Mitch


Here is my public share link: Webflow - SJE2
(how to access public share link)