HTML DOM scrollLeft Property
Voorbeeld
Bepaal het aantal pixels waarmee de inhoud van een <div>-element horizontaal en verticaal wordt gescrolld:
var elmnt = document.getElementById("myDIV");
var x = elmnt.scrollLeft;
var y = elmnt.scrollTop;
Meer "Probeer het zelf" voorbeelden hieronder.
Definitie en gebruik
De eigenschap scrollLeft bepaalt of retourneert het aantal pixels waarin de inhoud van een element horizontaal wordt verschoven.
Tip: gebruik de eigenschap scrollTop om het aantal pixels in te stellen of te retourneren waarin de inhoud van een element verticaal wordt gescrold.
Tip: Gebruik de CSS- overloopeigenschap om schuifbalken aan een element toe te voegen .
Browserondersteuning
Property | |||||
---|---|---|---|---|---|
scrollLeft | Yes | Yes | Yes | Yes | Yes |
Syntaxis
Retourneer de eigenschap scrollLeft:
element.scrollLeft
Stel de eigenschap scrollLeft in:
element.scrollLeft = pixels
Eigendomswaarden
Value | Description |
---|---|
pixels |
Specifies the number of pixels the element's content is scrolled horizontally. Special notes:
|
Technische details
Winstwaarde: | Een getal, dat staat voor het aantal pixels waarmee de inhoud van het element horizontaal is verschoven |
---|
Meer voorbeelden
Voorbeeld
Schuif de inhoud van een <div> element naar 50 pixels horizontaal en 10 pixels verticaal:
var elmnt = document.getElementById("myDIV");
elmnt.scrollLeft = 50;
elmnt.scrollTop = 10;
Voorbeeld
Scroll de inhoud van een <div> element DOOR 50 pixels horizontaal en 10 pixels verticaal:
var elmnt = document.getElementById("myDIV");
elmnt.scrollLeft += 50;
elmnt.scrollTop += 10;
Voorbeeld
Scroll de inhoud van <body> met 30 pixels horizontaal en 10 pixels verticaal:
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;