Maison > Article > interface Web > Comment jquery obtient-il la hauteur de la barre de défilement d'un élément et d'autres codes d'implémentation_jquery
Fonctions principales :
获取浏览器显示区域(可视区域)的高度 : $(window).height(); 获取浏览器显示区域(可视区域)的宽度 : $(window).width(); 获取页面的文档高度 $(document).height(); 获取页面的文档宽度 : $(document).width(); 浏览器当前窗口文档body的高度: $(document.body).height(); 浏览器当前窗口文档body的宽度: $(document.body).width(); 获取滚动条到顶部的垂直高度 (即网页被卷上去的高度) $(document).scrollTop(); 获取滚动条到左边的垂直宽度 : $(document).scrollLeft(); 获取或设置元素的宽度: $(obj).width(); 获取或设置元素的高度: $(obj).height(); 某个元素的上边界到body最顶部的距离:obj.offset().top;(在元素的包含元素不含滚动条的情况下) 某个元素的左边界到body最左边的距离:obj.offset().left;(在元素的包含元素不含滚动条的情况下) 返回当前元素的上边界到它的包含元素的上边界的偏移量:obj.offset().top(在元素的包含元素含滚动条的情况下) 返回当前元素的左边界到它的包含元素的左边界的偏移量:obj.offset().left(在元素的包含元素含滚动条的情况下)
//返回当前页面高度 function pageHeight(){ if($.browser.msie){ return document.compatMode == "CSS1Compat"? document.documentElement.clientHeight : document.body.clientHeight; }else{ return self.innerHeight; } }; //返回当前页面宽度 function pageWidth(){ if($.browser.msie){ return document.compatMode == "CSS1Compat"? document.documentElement.clientWidth : document.body.clientWidth; }else{ return self.innerWidth; } };
Les éléments suivants sont des ajouts d'autres internautes :
Obtenir la hauteur de la zone d'affichage du navigateur : $(window).height();
Obtenez la largeur de la zone d'affichage du navigateur : $(window).width();
Obtenez la hauteur du document de la page : $(document).height();
Obtenir la largeur du document de la page : $(document).width();
Obtenez la hauteur verticale de la barre de défilement vers le haut : $(document).scrollTop();
Obtenez la largeur verticale de la barre de défilement vers la gauche : $(document).scrollLeft();
Calculer la position et le décalage de l'élément : $(id).offset();
La méthode offset est une méthode très utile, qui renvoie les informations de décalage du premier élément de l'ensemble compressé. Par défaut, il s'agit des informations de décalage par rapport au corps. Le résultat contient deux attributs, top et left.
décalage(options, résultats)
options.relativeTo Spécifiez le calcul relatif
Calculez l'élément ancêtre de la position de décalage. Cet élément doit être positionné de manière relative ou absolue. S'il est omis, il est relatif au corps.
options.scroll S'il faut mettre
Les barres de défilement sont incluses, par défaut TRUE
options.padding S'il faut inclure le remplissage, par défaut false
options.margin
S'il faut inclure la marge, la valeur par défaut est vraie
options.border S'il faut inclure la bordure, true par défaut
La page enfant contrôle la page parent :
parent.document.documentElement.scrollTop;
parent.document.documentElement.clientHeight;