Streaming live at 10am (PST)

Hiding scroll bars on a 80Vh X 80Vw section


#1

Hi Guys,
I’m trying to hide the scrollbars on an auto-scroll section /divblock in a page.
The section has 80 by 80 vh/vw .
I know there’s more on this subject in the forum but i can’t find anywhere. I don’t need the fulljs as i want to hide only on a divblock / section
Thank you


#2

I’m not entirely sure I understand what you’re trying to do, but here goes:
The CSS property overflow controls what to do with overflowing content (i.e. content that doesn’t fit into the element), setting it to hidden will both stop the content from overflowing and remove any scroll bars on that element.

Webflow has this option integrated in the element’s “advanced” Layout Options, right above the position settings. Setting it to the crossed-out eye would probably do the trick.


#3


Thanks DukeDiamond, but i want to do is to keep my div/section scrollable, but hiding the scroll bar.
See the screenshot attached,
Thanks


#4

My body is set up to fixed 100x100 VW, the section has a padding of 10vh all sides.


#5

I suspect what you’re trying to do can not be achieved in any satisfactory measure…

The main issue is that scrollbars are not drawn by the browser’s HTML engine but by the browser; often dependent on system libraries – this means their implementation is highly inconsistent and varies widely over browsers and OSs.

This stackoverflow answer seems to provide a fairly reliable way of styling / hiding scrollbars, it still has some issues though.

Off the top of my head the only other option I see is setting overflow: hidden; and using JS to do the scrolling – the problem here being that the browser’s scrollEvent is triggered not when you use the scrollwheel but when the element actually scrolls. You’d seperately have to take care of handling touch events for mobile users as well though, and old-fashioned people like me that like to navigate their computers using the keyboard.

Far be it from me to lecture you on design decisions, but I guess from a UX perspective it doesn’t make much sense to remove the scrollbars from an element that is meant to be scrolled in. They serve as a visual clue to the user that there’s more content there than they can initially see – and enable them to track their progress…


#6

Fair point. Totally agree with you. Would be awesome though if you could style the colors of the scroll bar, at least to be closer to the color palette.
Anyhow, thank you for the guidance. Not a big expert in code so will just leave it as is.
I’ve read pages about the js issues over platforms and os and looks like a nightmare implementing it.
Hopefully, webflow team will find a workaround in the future.
Thanks again.