Maison  >  Article  >  interface Web  >  Comment jquery obtient-il la position d'un élément dans le navigateur ? Quelles sont les méthodes ?

Comment jquery obtient-il la position d'un élément dans le navigateur ? Quelles sont les méthodes ?

云罗郡主
云罗郡主avant
2018-10-29 15:36:193051parcourir

Comment jquery obtient-il la position d'un élément dans le navigateur ? Je crois que de nombreux amis qui viennent d'entrer en contact avec jquery se poseront de telles questions. Ce chapitre va vous présenter comment jquery obtient la position d'un élément dans le navigateur. Quelles sont les méthodes ? Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer. J'espère qu'il vous sera utile.

1. Récupérer l'objet (ajustement personnalisé pour ouvrir un nouvel élément de référence de fenêtre)

var obj = $(”#oButton”);

Dans l'exemple, l'objet que j'obtiens est le bouton de la fenêtre pop-up, donc le nouveau la fenêtre créée sera basée sur le bouton. La position est ajustée pour que la nouvelle fenêtre créée dans l'instance affiche le coin inférieur droit du bouton.

2. Obtenez la position de l'élément objet (méthode offset())

var offset = obj.offset();

Obtenez la position de l'élément objet, qui est en haut et à gauche de l'élément appelant. Les méthodes sont : offset.left et offset.top, vous pouvez connaître les positions gauche et supérieure de l'objet actuel.

3. Récupérer la largeur de l'élément objet (méthode width())

var right = offset.left+obj.width();

Dans l'exemple, la position du coin inférieur droit de l'objet est obtenue et la position gauche de la nouvelle fenêtre est créée.

4. Récupérer la hauteur de l'élément objet (méthode height())

var down = offset.top+obj.height();

Dans l'exemple, la position du coin inférieur droit de l'objet est obtenue et la position supérieure de la nouvelle fenêtre est créée.

5. Définissez les styles CSS et définissez respectivement la gauche et le haut.

‘left’:right,
‘top’:down,

Faites attention aux valeurs de margin et de padding dans les styles CSS, ainsi qu'à la compatibilité des navigateurs IE et Firefox.

Sur la base de l'exemple ci-dessus, il est très simple pour jQuery d'obtenir la position, la hauteur et la largeur de l'élément, grâce aux méthodes intégrées offset(), width() et height(), nous pouvons réaliser notre. ajustement dynamique et fonction d'ouverture d'une nouvelle fenêtre.Pour d'autres applications étendues, la même chose est vraie, comprendre la méthode de jQuery pour obtenir la position, la hauteur et la largeur des éléments sera très pratique pour créer de nouveaux éléments et ajuster la position et la taille des éléments.

Ce qui précède est une introduction complète à la façon dont jquery obtient la position d'un élément dans le navigateur ? Quelles sont les méthodes si vous voulez en savoir plus sur le Tutoriel vidéo JavaScript, Veuillez faire attention au site Web PHP chinois.


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!

Déclaration:
Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer