CSS blendet die Bildlaufleiste aus, aber das Element ist scrollbar

Ich habe dieses Element namens Elemente und der Inhalt innerhalb des Elements ist länger als die Elementhöhe, ich möchte es scrollbar machen, aber die Bildlaufleiste ausblenden, wie würde ich das tun?

<div class="left-side">
    <div class="items" style="display:block;width: 94%;margin: 0 auto;overflow: hidden;">
    </div>
</div>

.left-side {
    width: 1470px;
    padding-top: 20px;
    height: 878px;
}

Ich habe versucht, die linksseitige Klasse overflow auf auto zu setzen, aber das hat nichts gebracht.

Programmierung
html css
3. April 2017 в 1:31
noch keine Aufrufe
Lösung

Sie können es verstecken:

html {
  overflow:   scroll;
}
::-webkit-scrollbar {
    width: 0px;
    background: transparent; /* make scrollbar transparent */
}

Für weitere Informationen siehe : https://stackoverflow.com/questions/16670931/hide-scroll-bar-but-still-being-able-to-scroll

kylestephens
Bearbeitete Antwort 16. Januar 2019 в 12:38
Kommentare (6)

wenn Sie die Bildlaufleiste wirklich loswerden wollen, teilen Sie die Informationen auf zwei separate Seiten auf.

Usability-Leitlinien zu Scrollbars von Jakob Nielsen:

Es gibt fünf wesentliche Usability-Richtlinien für das Scrollen und Scrollbars:

Bieten Sie eine Bildlaufleiste an, wenn ein Bereich scrollbaren Inhalt hat. Don't rely on Verlassen Sie sich nicht auf das automatische Scrollen oder auf das Ziehen, das die Benutzer möglicherweise nicht bemerken.

  • Ausblenden Bildlaufleisten aus, wenn der gesamte Inhalt sichtbar ist. Wenn jemand eine Bildlaufleiste sieht, nimmt er nehmen sie an, dass es zusätzlichen Inhalt gibt und sind frustriert, wenn sie nicht scrollen können. ' blättern können.
  • Halten Sie sich an die GUI-Standards und verwenden Sie Bildlaufleisten, die aussehen wie Scrollbars.
  • Vermeiden Sie horizontales Scrollen auf Webseiten und minimieren Sie es anderswo.
  • Zeigen Sie alle wichtigen Informationen oberhalb der Falz an. Benutzer entscheiden oft, ob sie bleiben oder gehen, je nachdem, was sie sehen können ohne zu scrollen. Außerdem widmen sie nur 20 % ihrer Aufmerksamkeit unterhalb des Falzes.

Um Ihre Bildlaufleiste nur dann sichtbar zu machen, wenn sie benötigt wird (d. h. wenn es Inhalte gibt, zu denen man hinunterblättern kann), verwenden Sie "overflow: auto".

Yvonne Aburrow
Bearbeitete Antwort 3. April 2017 в 2:03
Kommentare (2)

Sie können das Plugin SlimScroll verwenden, um ein Div scrollbar zu machen, auch wenn es auf "overflow: hidden" eingestellt ist (d.h. die Bildlaufleiste ist ausgeblendet).

Mit diesem Plugin können Sie auch den Touch-Scroll sowie die Scrollgeschwindigkeit steuern.

Ich hoffe, das hilft :)

Kommentare (0)