Wie blende ich Bildlaufleisten aus, während das Scrollen mit Maus und Tastatur weiterhin möglich ist?

Bildlaufleisten ausblenden und gleichzeitig das Scrollen mit Maus/Tastatur beibehalten

Diese Frage wurde als Duplikat markiert, aber im ursprünglichen Thread wurde das Problem nicht ausreichend behandelt Spezielles Problem beim Ausblenden der Bildlaufleiste, während das Scrollen mit der Maus oder der Tastatur weiterhin möglich ist.

Original Frage:

Kann ich die Bildlaufleiste ausblenden und trotzdem das Scrollen mit der Maus oder der Tastatur ermöglichen?

CSS-Überlauf: Versteckte Einschränkung:

Die CSS-Eigenschaft overflow:hided kann zum Ausblenden der Bildlaufleiste verwendet werden, deaktiviert aber auch die Bildlauffunktion insgesamt.

jQuery-Lösung (Original):

Der ursprüngliche Thread schlug eine jQuery-Lösung vor, die die Breite des Textbereichs ohne Bildlaufleiste dynamisch misst und die Breite des Wrapper-Divs entsprechend festlegt. Dadurch entsteht die Illusion eines scrollbaren Div ohne sichtbare Bildlaufleiste.

// get the width of the textarea minus scrollbar
var textareaWidth = document.getElementById("textarea").scrollWidth;

// width of our wrapper equals width of the inner part of the textarea
document.getElementById("wrapper").style.width = textareaWidth + "px";

JavaScript-Lösung (ohne jQuery):

Alternativ kann das gleiche Prinzip auch ohne angewendet werden jQuery:

document.getElementById("wrapper").style.overflow = "hidden";

// get the width of the textarea minus scrollbar
var textareaWidth = document.getElementById("textarea").scrollWidth;

// width of our wrapper equals width of the inner part of the textarea
document.getElementById("wrapper").style.width = textareaWidth + "px";

Update:

Das gleiche Prinzip kann verwendet werden, um scrollbare Divs ohne Bildlaufleisten mithilfe von CSS und JavaScript zu erstellen.

Das obige ist der detaillierte Inhalt vonWie blende ich Bildlaufleisten aus, während das Scrollen mit Maus und Tastatur weiterhin möglich ist?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!