Wie automatisch Scrollbar im Windows-Browser ausblenden

Question

Ich habe mehrere Elemente mit overflow: auto. Es funktioniert gut. Auf macOS werden Bildlaufleisten automatisch ausgeblendet, wenn der Benutzer nicht scrollt und beim Scrollen erscheint.

Unter Windows und auf jedem Browser sind Scrollbars immer sichtbar. Es macht ein hässliches Rendering.

Wie kann ich automatisch Bildlaufleisten auf jedem Betriebssystem und jedem Browser ausblenden, wenn der Benutzer nicht scrollt?

Ich weiß, dass es viele ähnliche Frage ist, aber ich habe nicht mit einer geeigneten Antwort

Answer 1

perfect-scrollbar ist ein

Minimalistic aber perfekt individuelle Scrollbar Plugin

Es funktioniert gefunden fast jeden Webbrowser, einschließlich Internet Explorer.

Answer 2

Ich habe etwas gefunden! Ich habe nie gedacht, es könnte so einfach sein:

.my-elem { 
    overflow: hidden 
} 

.my-elem:hover { 
    overflow: auto 
} 

Answer 3

<style type="text/css"> 
body { 
    overflow:hidden; 
} 
</style> 

Der obige Code versteckt sich horizontale und vertikale Bildlaufleiste.

Da jeder Browser über ein eigenes Standard-Stylesheet "User Agent" verfügt, müssen Sie möglicherweise eine CSS-Zurücksetzung vornehmen, die das Styling aller HTML-Elemente auf eine konsistente Basislinie zurücksetzt. Dann wird Ihr HTML in allen Browsern gleich aussehen.

Sie können auch normalisieren. Normalize.css bewahrt nützliche Standardwerte, anstatt alles "aufzuschalten".