wake-up-neo.net

Wie kann ich die Scrollbar in Firefox ausblenden?

Ich habe gerade herausgefunden, wie man die Bildlaufleiste in Google Chrome ausblenden kann. Ich habe es mit diesem Code gemacht: 

::-webkit-scrollbar { display: none; }

Das einzige Problem ist, dass dies bei Firefox nicht funktioniert. Ich habe viele Möglichkeiten ausprobiert, aber es funktioniert immer noch nicht.

43
Daan Kleijngeld

Ich konnte die Bildlaufleiste ausblenden, konnte jedoch mit dieser Maus immer noch mit dem Mausrad scrollen:

html {overflow: -moz-scrollbars-none;}

Laden Sie das Plugin https://github.com/brandonaaron/jquery-mousewheel herunter und fügen Sie diese Funktion hinzu:

jQuery('html,body').bind('mousewheel', function(event) {
    event.preventDefault();
    var scrollTop = this.scrollTop;
    this.scrollTop = (scrollTop + ((event.deltaY * event.deltaFactor) * -1));
    //console.log(event.deltaY, event.deltaFactor, event.originalEvent.deltaMode, event.originalEvent.wheelDelta);
  });
19
CrazyScientist

Verwenden Sie für das Webkit Folgendes:

::-webkit-scrollbar {
    width: 0px;  /* remove scrollbar space */
    background: transparent;  /* optional: just make scrollbar invisible */
}

Verwenden Sie für Mozilla Firefox folgenden Code:

@-moz-document url-prefix() {
    html,body{overflow: hidden !important;}
}

und wenn das Scrollen nicht funktioniert, fügen Sie hinzu 

element {overflow-y: scroll;}

zu einem bestimmten Element

5
romal tandel

Sie können die scrollbar-width-Regel verwenden. Sie können scrollbar-width: none; die Scrollleiste in Firefox ausblenden und trotzdem frei scrollen.

body {
   scrollbar-width: none
}
5
George Flint

Dies ist eine generische Lösung:

<div class="outer">
 <div class="inner">
    Some content...
 </div>
</div>

<style>
 .outer {
 overflow: hidden;
}
 .inner {
 margin-right: -16px;
 overflow-y: scroll;
 overflow-x: hidden;
}
</style>

Die Bildlaufleiste wird durch das übergeordnete Div ausgeblendet.

Dies erfordert, dass Sie Überlauf verwenden: im übergeordneten Div ausgeblendet.

5
Myles

Um die Bildlaufleiste in Chrome, Firefox und IE auszublenden, können Sie Folgendes verwenden:

.hide-scrollbar
{
    overflow: auto;
    -ms-overflow-style: none; /* IE 11 */
    scrollbar-width: none; /* Firefox 64 */
}
3
Rowin

Dies ist, was ich brauchte, um Bildlaufleisten zu deaktivieren, während der Bildlauf in Firefox beibehalten wurde, Chrome und Edge in:

          @-moz-document url-prefix() { /* Disable scrollbar Firefox */
            html{
              scrollbar-width: none;
            }
          }
          body {
            margin: 0; /* remove default margin */
            scrollbar-width: none; /* Also needed to disable scrollbar Firefox */
            -ms-overflow-style: none;  /* Disable scrollbar IE 10+ */
            overflow-y: scroll;
          }
          body::-webkit-scrollbar {
            width: 0px;
            background: transparent; /* Disable scrollbar Chrome/Safari/Webkit */
          }
1
Logan Powell

Versuchen Sie es mit diesem:

overflow-y: -moz-hidden-unscrollable;

0
peeter

Fügen Sie eine CSS-Regel in body hinzu:

body{
  overflow: hidden;
}
0
Sergio Abreu

In der neueren Version von Firefox funktionieren die alten Lösungen nicht mehr, aber ich habe in Version 66.0.3 die Eigenschaft scrollbar-color Erfolgreich verwendet, die Sie auf transparent transparent Setzen können und in der die Bildlaufleiste angezeigt wird Firefox auf dem Desktop zumindest unsichtbar (findet immer noch im Ansichtsfenster statt und auf dem Handy funktioniert das nicht, aber dort ist die Bildlaufleiste eine feine Linie, die über dem Inhalt rechts platziert wird).

overflow-y: auto; //or hidden if you don't want horizontal scrolling
overflow-y: auto;
scrollbar-color: transparent transparent;
0
Chris Aelbrecht

In bestimmten Fällen (das Element befindet sich ganz rechts auf dem Bildschirm oder der übergeordnete Überlauf ist ausgeblendet), kann dies eine Lösung sein:

@-moz-document url-prefix() {
  .element {
    margin-right: -15px;
  }
}
0
gazdagergo