HTML DOM scrollWidth eigenschap
Voorbeeld
Verkrijg de volledige hoogte en breedte van een element, inclusief opvulling:
var elmnt = document.getElementById("content");
var y = elmnt.scrollHeight;
var x = elmnt.scrollWidth;
Meer "Probeer het zelf" voorbeelden hieronder.
Definitie en gebruik
De eigenschap scrollWidth retourneert de volledige breedte van een element in pixels, inclusief opvulling, maar niet de rand, schuifbalk of marge.
Tip: Gebruik de eigenschap scrollHeight om de volledige hoogte van een element te retourneren.
De eigenschappen scrollWidth en scrollHeight retourneren de volledige hoogte en breedte van een element, inclusief de hoogte en breedte die niet zichtbaar zijn (vanwege overloop).
Tip: Gebruik de CSS- overloopeigenschap om schuifbalken aan een element toe te voegen .
Deze eigenschap is alleen-lezen.
Browserondersteuning
Property | |||||
---|---|---|---|---|---|
scrollWidth | Yes | Yes | Yes | Yes | Yes |
Syntaxis
element.scrollWidth
Technische details
Winstwaarde: | Een getal, dat de volledige breedte (horizontaal) van een element in pixels weergeeft |
---|
Meer voorbeelden
Voorbeeld
Opvulling, rand, schuifbalk en marge gebruiken om te laten zien hoe dit de eigenschap scrollWidth en scrollHeight beïnvloedt:
var elmnt = document.getElementById("content");
var y = elmnt.scrollHeight;
var x = elmnt.scrollWidth;
Voorbeeld
Retourneer de scrollHeight en scrollWidth van een element en stel vervolgens de hoogte en breedte in op de waarden die worden geretourneerd door scrollHeight en scrollWidth:
var elmnt = document.getElementById("content");
function getFunction() {
var x = elmnt.scrollWidth;
var y = elmnt.scrollHeight;
}
function setFunction() {
elmnt.style.height = y.scrollHeight + "px";
elmnt.style.width = y.scrollWidth + "px";
}