Scrollbar in Firefox ausblenden

Ich möchte eine Bildlaufleiste in der Seite ausblenden, aber ich kann scrollen, wie es eine Bildlaufleiste hat. so kann ich Überlauf nicht verwenden: ausgeblendet, weil ich möchte, dass ich wie normal scrollen kann , aber nicht eine Bildlaufleiste sehen kann.Scrollbar in Firefox ausblenden

so verwende ich diese CSS-Code (Klasse nicht-Scroll-Körper eine Klasse von Body-Tag ist)

.not-scroll-body::-webkit-scrollbar { 
    display: none; 
}

Es in Chrome funktioniert, aber wenn ich -moz- statt -webkit- wie diese

.not-scroll-body::-moz-scrollbar { 
    display: none; 
}

Es funktioniert nicht in Firefox.

Was kann ich tun, damit es funktioniert?

Vielen Dank für jede Antwort und sorry für mein schlechtes Englisch Sprache :)

Quelle

2013-10-25 Mei

Warum beide gerade nicht benutzen? –

Auch, Willkommen zu StackOverflow, und Ihr Englisch ist in Ordnung :) –

@christian Eigentlich verwende ich beide in meinem Code, aber es funktioniert nur mit Chrome, nicht mit Firefox: ') – Mei

Nach this answer und alles, was ich habe in der Lage, die im Internet zu finden, gibt Äquivalent des -webkit-scrollbar Wähler kein Firefox ist. Anscheinend gibt es used to be eine Eigenschaft, -moz-scrollbars-none, die Sie dafür verwenden könnten, aber es wurde seither entfernt und Menschen recommend mit overflow:hidden oder eine hackish margin-right: -14px Lösung.

Tut mir leid, ich kann nicht hilfsbereiter sein - es scheint als gäbe es keinen Firefox-Weg, dies elegant zu machen.

Quelle

2013-10-25 03:14:09

Ich habe versucht, Rand rechts: -14px, aber die Scrollbar hat die Position nicht geändert (es ist nichts passiert) obwohl der Inhalt innerhalb der Position nach rechts wechselt (von Rand rechts -14) – Mei

aber Ihre Antwort ist sehr hilfreich, vielen Dank: D – Mei

be be - seien Sie sicher, dass das übergeordnete Element ist 'overflow: hidden' –

konnte ich die Scrollbar verstecken, aber noch in der Lage sein, mit dem Mausrad mit dieser Lösung blättern:

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

Laden Sie das Plugin https://github.com/brandonaaron/jquery-mousewheel und schließen Sie diese Funktion:

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); 
    });

Quelle

2014-09-18 05:10:34 CrazyScientist

ich vorausgesetzt, Sie wollen um die Bildlaufleiste lokal auszublenden. In diesem Sinne, nicht auf einem Webserver für die Welt zu sehen, aber auf Ihrer lokalen Kopie von Firefox, nur für Ihr "Sehvergnügen".

das ist, was ich gefunden habe, um für mich auf opensuse/kde: in userChrome.css arbeiten;

Verwenden Sie -14px, um den vertikalen Bildlauf vollständig zu verbergen (mehr, wenn Ihr Systemdesign eine breitere Bildlaufeinstellung aufweist). Ich benutze weniger (10px), um nur ein wenig davon zu sehen, damit ich mit der mittleren Maustaste auf einen Platz auf der Seite springen kann.

Sache, die ich tat, aber nicht immer, nicht mehr: in userContent.css

#content browser { 
overflow:-moz-scrollbars-none; 
}

-oder

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

oben gearbeitet hat, aber ich mich jetzt habe die Mausrad-Scroll verloren. Nur Tastaturpfeiltasten funktionieren jetzt.

Ich hoffe, ich habe verstanden, was Sie wollen und das hilft. Landis.

Quelle

2016-05-25 09:12:09

Sie könnten overflow:-moz-hidden-unscrollable verwenden - das funktionierte perfekt für meine Bedürfnisse in Teil, weil ich bereits dragscroll.js verwendet habe.

Quelle

2016-08-21 03:21:24

cf: https://stackoverflow.com/a/41021131/4881677

Dies ist, wie ich es tun, nur CSS und arbeitet gut mit Frameworks wie Bootstrap. Es braucht nur 2 extra div:

Sie können den Text auswählen, um es scrollen oder mit den Fingern scrollen, wenn Sie einen Touchscreen haben.

.overflow-x-scroll-no-scrollbar {overflow:hidden;} 
 
.overflow-x-scroll-no-scrollbar div { 
 
    overflow-x:hidden; 
 
    margin-bottom:-17px; 
 
    overflow-y:hidden; 
 
    width:100%; 
 
} 
 
.overflow-x-scroll-no-scrollbar div * { 
 
    overflow-x:auto; 
 
    width:100%; 
 
    padding-bottom:17px; 
 
    white-space: nowrap; 
 
    cursor:pointer 
 
} 
 

 
/* the following classes are only here to make the example looks nicer */ 
 
.row {width:100%} 
 
.col-xs-4 {width:33%;float:left} 
 
.col-xs-3 {width:25%;float:left} 
 
.bg-gray{background-color:#DDDDDD} 
 
.bg-orange{background-color:#FF9966} 
 
.bg-blue{background-color:#6699FF} 
 
.bg-orange-light{background-color:#FFAA88} 
 
.bg-blue-light{background-color:#88AAFF}

<html><body> 
 
    <div class="row"> 
 
    <div class="col-xs-4 bg-orange">Column 1</div> 
 
    <div class="col-xs-3 bg-gray">Column 2</div> 
 
    <div class="col-xs-4 bg-blue">Column 3</div> 
 
    </div> 
 
    <div class="row"> 
 
    <div class="col-xs-4 bg-orange-light">Content 1</div> 
 
    <div class="col-xs-3 overflow-x-scroll-no-scrollbar"> 
 
     <div> 
 
     <div>This content too long for the container, so it needs to be hidden but scrollable without scrollbars</div> 
 
     </div> 
 
    </div> 
 
    <div class="col-xs-4 bg-blue-light">Content 3</div> 
 
    </div> 
 
</body></html>

Kurzversion für faule Leute:

.overflow-x-scroll-no-scrollbar {overflow:hidden;} 
 
.overflow-x-scroll-no-scrollbar div { 
 
    overflow-x:hidden; 
 
    margin-bottom:-17px; 
 
    overflow-y:hidden; 
 
    width:100%; 
 
} 
 
.overflow-x-scroll-no-scrollbar div * { 
 
    overflow-x:auto; 
 
    width:100%; 
 
    padding-bottom:17px; 
 
    white-space: nowrap; 
 
    cursor:pointer 
 
} 
 

 
/* the following classes are only here to make the example looks nicer */ 
 
.parent-style {width:100px;background-color:#FF9966}

<div class="parent-style overflow-x-scroll-no-scrollbar"> 
 
    <div> 
 
    <div>This content too long for the container, so it needs to be hidden but scrollable without scrollbars</div> 
 
    </div> 
 
</div>

Quelle

2016-12-07 15:05:02 Jean

Scrollbar in Firefox ausblenden

Antwort

Verwandte Themen