HTML-DOM scrollLeft- Eigenschaft
Beispiel
Ermitteln Sie die Anzahl der Pixel, um die der Inhalt eines <div> -Elements horizontal und vertikal gescrollt wird:
var elmnt = document.getElementById("myDIV");
var x = elmnt.scrollLeft;
var y = elmnt.scrollTop;
Weitere „Probieren Sie es selbst“-Beispiele weiter unten.
Definition und Verwendung
Die scrollLeft-Eigenschaft legt die Anzahl der Pixel fest, um die der Inhalt eines Elements horizontal gescrollt wird, oder gibt sie zurück.
Tipp: Verwenden Sie die scrollTop- Eigenschaft, um die Anzahl der Pixel festzulegen oder zurückzugeben, um die der Inhalt eines Elements vertikal gescrollt wird.
Tipp: Um einem Element Bildlaufleisten hinzuzufügen, verwenden Sie die CSS- Überlaufeigenschaft .
Browser-Unterstützung
| Property | |||||
|---|---|---|---|---|---|
| scrollLeft | Yes | Yes | Yes | Yes | Yes |
Syntax
Rückgabe der scrollLeft-Eigenschaft:
element.scrollLeft
Legen Sie die scrollLeft-Eigenschaft fest:
element.scrollLeft = pixels
Eigenschaftswerte
| Value | Description |
|---|---|
| pixels |
Specifies the number of pixels the element's content is scrolled horizontally. Special notes:
|
Technische Details
| Rückgabewert: | Eine Zahl, die die Anzahl der Pixel darstellt, um die der Inhalt des Elements horizontal gescrollt wurde |
|---|
Mehr Beispiele
Beispiel
Scrollen Sie den Inhalt eines <div>-Elements BIS 50 Pixel horizontal und 10 Pixel vertikal:
var elmnt = document.getElementById("myDIV");
elmnt.scrollLeft = 50;
elmnt.scrollTop = 10;
Beispiel
Scrollen Sie den Inhalt eines <div>-Elements UM 50 Pixel horizontal und 10 Pixel vertikal:
var elmnt = document.getElementById("myDIV");
elmnt.scrollLeft += 50;
elmnt.scrollTop += 10;
Beispiel
Scrollen Sie den Inhalt von <body> horizontal um 30 Pixel und vertikal um 10 Pixel:
var body = document.body; // Safari
var html = document.documentElement; //
Chrome, Firefox, IE and Opera places the overflow at the <html> level, unless else is specified. Therefore, we use the
documentElement property for these browsers
body.scrollLeft += 30;
body.scrollTop += 10;
html.scrollLeft += 30;
html.scrollTop += 10;