Hide a custom scroll bar without scrolling. scroll a custom scroll bar.

Hide a custom scroll bar without scrolling. scroll a custom scroll bar.

Some browsers now support custom scroll bars, making them a rescue for designers and perfectionists. After the new version was launched, the designer raised a new requirement: Hide the scroll bar on the right of the navigation bar without scrolling(A small video is also sent to indicate the effect ). Is the crude line on the right side: Chrome/Safari/Firefox browsers are tested on mac systems, and the scroll bars are hidden by default when these systems do not scroll. For example

It turns out that the custom scroll bar shields this feature of the system.

Solution: Set the outer package layer to overflow-y: hidden by default. When the hover effect is set, the overflow: auto is shown as follows:

<! DOCTYPE html>