|
|
Publié sur 03/07/2018 16:54:42
|
|
|
Javascrip{filter}t obtient la taille de l’écran, de la fenêtre du navigateur, du navigateur, ainsi que la hauteur et la largeur de la page web
Zone de visibilité de la page web : document.body.clientWidth
Zone de visibilité de la page web : document.body.clientHauteur
Largeur de la zone visible de la page web : document.body.offsetWidth (y compris la largeur de l’arête)
Surface visible de la page web : document.body.offset Hauteur (y compris la largeur du bord)
La largeur complète du texte du corps de la page web : document.body.scrollWidth
Le texte intégral de la page web est en haut : document.body.scrollHeight
La page est défilée en hauteur : document.body.scrollTop
La page est déplacée vers la gauche : document.body.scrollLeft
Sur le corps de la page web : window.screenTop
Le corps de la page web est à gauche : window.screenLeft
Haute résolution d’écran : window.screen.height
Largeur de la résolution de l’écran : window.screen.width
Écran disponible hauteur de l’espace de travail : window.screen.availHeight
Largeur d’espace de travail disponible à l’écran : window.screen.availWidth
jQuery obtient différentes largeurs et hauteurs
Zone de visualisation du navigateur
$(fenêtre).hauteur()
$(fenêtre).largeur()
La taille du document de la page
$(document).hauteur()
$(document).width()
La taille du corps actuel du document fenêtre
$(document.body).hauteur()
$(document.body).width()
La hauteur verticale de la barre de défilement par rapport au haut (c’est-à-dire la hauteur à laquelle la page est roulée)
$(document).scrollTop()
$(document).scrollLeft()
Ciblage précis HTML : scrollLeft, scrollWidth, clientWidth, offsetWidth
scrollHeight: 获取对象的滚动高度。
scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离
scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离
scrollWidth:获取对象的滚动宽度
offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度
offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置
offsetTop:获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置
event.clientX par rapport aux coordonnées horizontales du document
event.clientY par rapport aux coordonnées verticales du document
event.offsetX par rapport aux coordonnées horizontales du conteneur
event.offsetY par rapport aux coordonnées verticales du conteneur
document.documentElement.scroll Valeur supérieure pour le défilement vertical
event.clientX+document.documentElement.scrollTop La quantité de coordonnées horizontales + défilement vertical par rapport au document
C’est-à-dire que les différences entre Firefox sont les suivantes :
IE6.0、FF1.06+ :
Largeur du client = largeur + bourrage
clientHauteur = hauteur + rembourrage
offsetWidth = largeur + bourrage + bordure
décalage Hauteur = hauteur + rembourrage + bordure
IE5.0/5.5 :
Largeur du client = largeur - bordure
clientHeight = hauteur - bordure
OffsetWidth = largeur
décalageHauteur = hauteur
(Il convient de mentionner : l’attribut margin dans CSS n’a rien à voir avec clientWidth, offsetWidth, clientHeight, offsetHeight)
Zone de visibilité de la page web : document.body.clientWidth
Zone de visibilité de la page web : document.body.clientHauteur
Largeur de la zone visible de la page web : document.body.offsetWidth (y compris la largeur de l’arête)
Hauteur de la zone visible du Web : document.body.offset Hauteur (y compris la hauteur des bords)
La largeur complète du texte de la page web : document.body.scrollWidth
Texte intégral hauteur : document.body.scrollHeight
La page est défilée en hauteur : document.body.scrollTop
La page est déplacée vers la gauche : document.body.scrollLeft
Sur le corps de la page web : window.screenTop
À gauche du corps de la page web : window.screenLeft
Haute résolution d’écran : window.screen.height
Largeur de la résolution de l’écran : window.screen.width
Écran disponible hauteur de l’espace de travail : window.screen.availHeight
Largeur d’espace de travail disponible à l’écran : window.screen.availWidth
div.style.top : La distance supérieure par rapport à la composante où se trouve la div
－－－－－－－－－－－－－－－－－－－
Faits techniques
Le code de cette section utilise principalement certaines propriétés de l’objet Document concernant la fenêtre, et les principales fonctions ainsi que l’utilisation de ces propriétés sont les suivantes.
Pour obtenir la taille d’une fenêtre, différentes propriétés et méthodes doivent être utilisées selon les navigateurs : pour détecter la taille réelle d’une fenêtre, il faut utiliser la propriété de Window dans Netscape ; Dans IE, il faut aller profondément dans le document pour détecter le corps. Dans l’environnement DOM, pour obtenir la taille de la fenêtre, il faut faire attention à la taille de l’élément racine, pas à l’élément.
La propriété innerWidth de l’objet Fenêtre contient la largeur interne de la fenêtre courante. La propriété innerHeight de l’objet Fenêtre contient la hauteur interne de la fenêtre actuelle.
L’attribut corps de l’objet Document correspond à l’étiquette du document HTML. La propriété documentElement de l’objet Document représente le nœud racine du document HTML.
document.body.clientHeight indique la hauteur actuelle de la fenêtre dans laquelle se trouve le document HTML. document.body. clientWidth représente la largeur actuelle de la fenêtre dans laquelle se trouve le document HTML.
Événements de taille des navigateurs
window.onresize=funName ; Appelez la fonction funName lorsque la taille du navigateur change |
Précédent:SEO Titre Mot-Clé Description Limite de mots Titre, mots-clés, Descrip{filter}tion LengthProchain:Le type « Objet » est défini dans un assembleur non référencé. Il faut ajouter une réponse au programme...
|
