Cet article présente principalement le rôle de getBoundingClientRect dans js et une explication détaillée de la solution de compatibilité. Maintenant, je le partage avec vous et lui donne une référence.
1. La fonction de getBoundingClientRect
getBoundingClientRect est utilisée pour obtenir l'ensemble de positions d'un élément html par rapport à la fenêtre de vue.
L'exécution de object.getBoundingClientRect(); obtiendra les attributs haut, droite, bas, gauche, largeur et hauteur de l'élément. Ces attributs sont renvoyés sous forme d'objet.
getBoundingClientRect()
Cette méthode renvoie un objet rectangle contenant quatre propriétés : gauche, haut, droite et bas. Représente la distance entre chaque côté de l'élément et respectivement les côtés supérieur et gauche de la page.
1 2 3 4 5 6 7 8 9 |
|
2. Explication des valeurs d'attribut supérieure, inférieure, gauche et droite de getBoundingClientRect
Principalement gauche et bas doivent être expliqués, gauche fait référence à la distance entre la droite et le côté gauche de la page, en bas Il fait référence à la distance entre le bord inférieur et le bord supérieur de la page.
Afficher les images :
3. Compatibilité du navigateur
ie5 et supérieur peuvent être pris en charge, mais quelques-uns. les choses doivent être corrigées.
La gauche et le haut d'IE67 seront 2px de moins, et il n'y aura pas d'attributs de largeur ou de hauteur.
4. Utilisez getBoundingClientRect pour écrire une méthode permettant d'obtenir l'ensemble de positions des éléments HTML par rapport à la fenêtre
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
|
Ce qui précède est ce que j'ai compilé pour tout le monde. J'espère que cela sera utile à l'avenir.
Articles associés :
Type de numéro en JS (tutoriel détaillé)
Comment utiliser le plug-in de navigateur Batarang en Angular
Précharger l'utilisation de la montre dans vue
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!