What is causing the scroll wheel to stop working on the published Webflow site when reaching the section with the black and white gradient?

If the scroll wheel stops working on a specific section (like one with a black and white gradient), it's likely due to a scroll interaction, overflow setting, or a full-page section setup that hijacks scroll behavior.

1. Check for Scroll-Based Interactions

• Go to Interactions panel (lightning icon) in Webflow Designer and look for any Page Scroll or While Scrolling in View interactions.
• Check if any are applied to the section with the black and white gradient.
• If the interaction uses "Scroll Into View" and pins or blocks movement via transforms, it may prevent normal scroll behavior.

2. Inspect Section Overflow Styles

• Select the problematic section, go to the Style panel, and check the Overflow setting.
• If Overflow is set to “hidden” on the section or any parent containers (like Body, Main Wrapper, etc.), it may cut off scrollable content.
• Try setting overflow to visible or ensure the scrollable content isn't being clipped.

3. Review Custom Code or Third-Party Scroll Scripts

• Go to Project Settings > Custom Code or check the Page Settings > Custom Code, and review any JavaScript that may be preventing scrolling.
• Look for libraries like fullPage.js, Lenis, Locomotive Scroll or custom code that uses preventDefault() on scroll events.

4. Check for Fixed or Full-Height Sections

• If this section is 100vh (full height) and has overflow hidden, and there's no visible scrollable content, the browser could behave as if it has reached a scroll boundary.
• Make sure this section isn’t blocking scroll unintentionally, especially if it's meant to be a transitional section.

5. Use Webflow’s Preview vs Published Site

• Sometimes interactions behave differently in Preview vs Live site due to page load timing or initial state settings.
• Publish the site and test in an incognito browser window to confirm behavior.

Summary

The scroll wheel stopping on the gradient section is likely caused by a scroll interaction, overflow:hidden setting, or full-height section suppressing scroll events. Inspect interactions, overflow styles, and any custom code to locate and resolve the blocking behavior.