Exemple
Obtenir toute la hauteur et la largeur d'un élément, comprenant un rembourrage:
var elmnt = document.getElementById("content");
var y = elmnt.scrollHeight;
var x = elmnt.scrollWidth;
Essayez vous - même » Plus "Try it Yourself" - "Try it Yourself" exemples ci - dessous.
Définition et utilisation
La propriété scrollWidth renvoie toute la largeur d'un élément en pixels, comprenant un rembourrage, mais pas la frontière, la barre de défilement ou de la marge.
Astuce: Utilisez la scrollHeight propriété pour retourner toute la hauteur d'un élément.
Les propriétés scrollWidth et scrollHeight retour sur toute la hauteur et la largeur d'un élément, dont la hauteur et la largeur qui est non visible (because of overflow) à (because of overflow) - (because of overflow) .
Astuce: Pour ajouter des barres de défilement à un élément, utilisez le CSS overflow propriété.
Cette propriété est en lecture seule.
Support du navigateur
Propriété | |||||
---|---|---|---|---|---|
scrollWidth | Oui | Oui | Oui | Oui | Oui |
Syntaxe
element .scrollWidth
Détails techniques
Valeur de retour: | Un nombre, représentant la totalité de la largeur (horizontally) d'un élément, en pixels |
---|
autres exemples
Exemple
En utilisant padding, border, barre de défilement et la marge pour montrer comment cela affecte la propriété scrollWidth et scrollHeight:
var elmnt = document.getElementById("content");
var y = elmnt.scrollHeight;
var x = elmnt.scrollWidth;
Essayez vous - même » Exemple
Remettre le scrollHeight et scrollWidth d'un élément, puis définir sa hauteur et la largeur des valeurs retournées par scrollHeight et 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";
}
Essayez vous - même »