Streaming live at 10am (PST)

Chrome Desktop Sticky + Interaction Issue

I have an interaction that plays while the sticky div stays in place within a slider.

It’s working on preview and safari, mobile chrome, it even starts to work on desktop until the page loads fully…but after all the scripts have loaded, the sticky positioning is ignored and the interaction doesn’t appear how I thought it would on Chrome Desktop.

Any idea why this isn’t working today?


Here is my site Read-Only: https://preview.webflow.com/preview/cannabanana?utm_medium=preview_link&utm_source=dashboard&utm_content=cannabanana&preview=9e4c581d6381138daa0944ef163d83d1&mode=preview

Hi, @istirton!

Ben here with the Webflow Customer Support Team!

I’m happy to help with this. Can you let me know which elements are causing the issues and what page they’re on? Thanks!

1 Like

It’s on my index page [Home] and the element that’s not sticking is [homepage-header].

Also might be helpful to note, the interaction it’s utilizing is called header-animation.

1 Like

Thanks, @istirton!

I did some investigating and it looks like a parent element of the position: sticky element has a height set on it.

CloudApp

Position sticky may not work correctly if any parent element has a set height or overflow set to hidden, scroll, or auto.

If this doesn’t resolve your issue, let me know and we can take a closer look! :webflow_heart:

Okay thank you for the advice. I’m not sure how else to achieve that sticky section without making the parent element a set height.

Is it usual for an issue like this to randomly jump out? I’ve had the parent element set at 200vh and it’s been working for weeks. All of a sudden stopped working.

I removed the fixed height in the parent element. I’m still getting the issue. Any other ideas?

This issue seems to have resolved itself! Weird.

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.