Streaming live at 10am (PST)

Prevent Body Scrolling on Mobile Navigation Open

Hey, @dankanvis!

.open-button-class-nameand .close-button-class-name or .open-close-button-class should be classnames of your buttons

Got it. It worked. Thank you so much for the quick reply!

1 Like

Hi, sabanna!

I have tried your advice in order to fix my problem with scrolling body on Mobile version when block with course info is open. But it didn’t work. Maybe I done smth wrong. Can you look at this please?
My published site - https://bluria-5d03f02f3df10a749e-2930ecbd5bffd.webflow.io/
Preview link https://preview.webflow.com/preview/bluria-5d03f02f3df10a749e-2930ecbd5bffd?utm_medium=preview_link&utm_source=dashboard&utm_content=bluria-5d03f02f3df10a749e-2930ecbd5bffd&preview=e9782d059806143283b150cb13b2ac61&mode=preview

I use “open-button-class-name” class for scroll block (it open info about course) and “close-button-class-name” for Close block (this is a cross that closes the course info)

Also it works wrong in Safari.

This code worked almost perfectly here. The only thing weird is that for some reason, it’s not considering my scroll position, so the overlay is shown on a random area of the page.

Read-Only link: https://preview.webflow.com/preview/mousehovert-7de83ebb74d05841832daf3ecc?utm_medium=preview_link&utm_source=designer&utm_content=mousehovert-7de83ebb74d05841832daf3ecc&preview=42692d0aca77b1634583b3bf3ff8f831&mode=preview

Does anyone have any idea about what is happening here?

1 Like

Wonderful solution.
it works for me correctly.

Hi @Siton_Systems ! This solution worked perfectly for me… except for one thing. The scroll behavior on iOS is affected a little bit. The up and down status/action bars in safari don’t go away/minimize like they should and I can’t tap on the adress bar to go back to the top of the page.

Any idea why that is?

Super thanks!

Best regards,
Björn