Explication détaillée sur la façon d'utiliser js pour obtenir la hauteur d'une page Web et les calculs de marge conventionnels

Comment js ou jquery obtient-il la hauteur ou la largeur commune d'une page Web? L'éditeur l'a résumé, jetons un coup d'oeil.

Largeur de la zone visible de la page Web : document.body.clientWidth
La hauteur de la zone visible de la page web : document.body.clientHeight;
La largeur de la zone visible de la page web : document.body.offsetWidth (y compris la largeur du bord);
Hauteur de la zone visible de la page Web : document.body.offsetHeight (y compris la largeur des bords);
Largeur du texte intégral du corps principal de la page Web : document.body.scrollWidth;
Hauteur du texte intégral de la page Web : document.body.scrollHeight;
La hauteur de la page Web en cours de défilement : document.body.scrollTop;
Le côté gauche de la page Web en cours de défilement : document.body.scrollLeft;
Sur le corps principal de la page Web : window.screenTop;
Sur la gauche du corps principal de la page Web : window.screenLeft;
La hauteur de la résolution de l'écran : window.screen.height;
La largeur de la résolution de l'écran : window.screen.width;
Hauteur de la zone de travail disponible à l'écran : window .screen.availHeight;
Largeur de la zone de travail disponible à l'écran : window.screen.availWidth;

scrollHeight : Obtenez la hauteur de défilement de l'objet.
scrollLeft : Définit ou obtient la distance entre le bord gauche de l'objet et l'extrémité la plus à gauche du contenu actuellement visible dans la fenêtre
scrollTop : Définit ou obtient la distance entre le haut et la distance entre le haut du contenu visible dans la fenêtre
scrollWidth : Obtient la largeur de défilement de l'objet
offsetHeight : Obtient l'objet relatif à la mise en page ou spécifiée par les coordonnées parent propriété offsetParent La hauteur de la coordonnée parent
offsetLeft : Obtient la position gauche calculée de l'objet par rapport à la mise en page ou la coordonnée parent spécifiée par l'attribut offsetParent
offsetTop : Récupère l'objet par rapport à la mise en page Ou la position supérieure calculée de la coordonnée parent spécifiée par l'attribut offsetTop
event.clientX La coordonnée horizontale par rapport au document
event.clientY La coordonnée verticale par rapport au document

event.offsetX coordonnée horizontale par rapport au conteneur
event .offsetY coordonnée verticale par rapport au conteneur
document.documentElement.scrollTop vertical La valeur du défilement directionnel
event.clientX+document.documentElement.scrollTop La coordonnée horizontale relative au document + la quantité de défilement vertical
Publié par molong le 19/05/2009 23:57 #1

Pour obtenir la coordonnée verticale position de la barre de défilement sur la page actuelle, utilisez :
document.documentElement.scrollTop;
au lieu de :
document. body.scrollTop;
documentElement correspond à la balise html, et body correspond à la balise body.

Sous le standard w3c, document.body.scrollTop vaut toujours 0 et doit être remplacé par document.documentElement.scrollTop
Si vous souhaitez positionner; la souris Par rapport à la position absolue de la page, vous constaterez que 999,99 des 1 000 articles de Google vous permettront d'utiliser event.clientX+document.body.scrollLeft, event.clientY+document.body.scrollTop Si vous trouvez cela. votre souris Ne soyez pas surpris si le positionnement s'écarte de votre imagination, c'est tout à fait normal.
L'objet document.body.scrollX n'est plus pris en charge après ie5.5.
Donc lors de la programmation, merci d'ajouter ce jugement

if (document.body && document.body.scrollTop && document.body.scrollLeft)
{
top=document.body.scrollTop;
left=document.body.scrollleft;    
}
if (document.documentElement && document.documentElement.scrollTop && document.documentElement.scrollLeft)
{
top=document.documentElement.scrollTop;
left=document.documentElement.scrollLeft;
}