Hi everyone,
I’m currently facing an issue on my Webflow project where I’m trying to implement a page loader from Relume along with Finsweet’s Scroll Disable attribute, but I can’t seem to get it to work as expected.
Setup:
-
I’ve added the Finsweet Scroll Disable script to my page’s
<head>
as follows:<script defer src="https://cdn.jsdelivr.net/npm/@finsweet/attributes-scrolldisable@1/scrolldisable.js"></script>
-
I applied the
fs-scrolldisable-element="when-visible"
attribute to the page loader element in Webflow’s Custom Attributes panel.
Problem:
Even though I followed the instructions, the page is still scrollable while the page loader is active. The Finsweet attribute doesn’t seem to be preventing scrolling as intended.
What I’ve Tried:
-
Checked Console Errors: There are several WebGL-related errors in the browser console that might be interfering with the script:
GL_INVALID_FRAMEBUFFER_OPERATION: Framebuffer is incomplete: Attachment has zero size.
GL_INVALID_VALUE: Texture dimensions must all be greater than zero.
-
Testing in Different Browsers: The issue persists across different browsers, and the errors in the console remain consistent.
-
Script Placement: I’ve ensured that the script is placed correctly in the
<head>
tag and that the custom attribute is applied to the correct element.
Questions:
- Has anyone else experienced conflicts between WebGL errors and Finsweet attributes, or any other custom scripts in Webflow?
- Could the WebGL errors be the reason why the scroll lock isn’t working, and if so, how can I resolve them?
- Is there a specific way to ensure that the scroll lock is applied only while the page loader is visible?
Any advice or solutions would be greatly appreciated. I’m stuck on this issue and could really use some help!
Here’s my Read Only Link:
https://preview.webflow.com/preview/stocker-transporte-ag-46aa7f43d7286abba?utm_medium=preview_link&utm_source=designer&utm_content=stocker-transporte-ag-46aa7f43d7286abba&preview=f5dfade692d557c48fc3f7256c9cd702&workflow=preview
Thanks in advance!