Méthode de remplacement sûre pour la méthode jQuery.position() qui ne peut pas obtenir la valeur_jquery

L'appel de la méthode jQuery.position() renverra la position par rapport à l'élément parent. La documentation officielle de jQuery décrit qu'elle est différente de la méthode .offset() qui renvoie la position par rapport au document, tandis que .position() renvoie la position par rapport à l'élément parent.

Mais en fait, lors de l'utilisation, nous avons constaté que la valeur renvoyée par .position() est souvent 0. Mais le fait n’est pas nul. Surtout dans Google Chrome et le navigateur IE. Firefox n'a pas ce problème.

La raison est qu'en prenant comme exemple les navigateurs basés sur Webkit (navigateur Google Chrome et Safari), ce n'est que lorsque les éléments (images, flash, etc.) sont complètement chargés que le navigateur peut accéder à la hauteur et à la largeur de ces éléments. Firefox peut accéder à ces propriétés après le chargement du DOM et n'a pas besoin de connaître la taille complète de l'élément. Ce n'est pas le cas avec Google Chrome. Par conséquent, dans les navigateurs tels que Google/IE, si vous souhaitez utiliser .position() pour obtenir le décalage d'un élément, la valeur que vous obtenez est souvent la valeur initiale : 0.

Un remède consiste à placer votre appel .position() après le déclenchement de l'événement $(window).load(), plutôt qu'après l'événement $(document).ready. Mais cette méthode n’est peut-être pas fiable.

Une autre alternative consiste à utiliser .offset() pour convertir :

Copier le code Le code est le suivant :

jQuery.fn.aPosition = fonction() {
ThisLeft = this.offset().left;
ThisTop = this.offset().top;
CeParent = this.parent();

parentLeft = thisParent.offset().left;
parentTop = thisParent.offset().top;

revenir {
           gauche : thisLeft-parentLeft,
         haut : thisTop-parentTop
};
};

Bien que cela génère du code redondant, son utilisation est bien plus fiable et rassurante.