JQuery offset () ne fonctionne pas dans certains navigateurs, sur certains ordinateurs

J'ai un problème de positionnement d'un élément dans certains navigateurs. J'utilise l'autocomplé jQuery trouvé ici . La div contenant des valeurs de remplissage automatique doit être directement dans la zone de texte et s'aligner parfaitement. Le code définit la propriété gauche css du div en utilisant la propriété gauche générée par $(textbox).offset();

Après avoir supprimé le code pour essayer de corriger mon problème, j'obtiens ceci:

 var a = $(textbox).offset(); element.css({ width: typeof e.width == "string" || e.width > 0 ? e.width : $(textbox).width(), top: a.top + textbox.offsetHeight, left: a.left }).show(); 

Cela semble qu'il devrait fonctionner, et cela fonctionne dans Firefox. Cela ne fonctionne pas dans IE8, Chrome. La position supérieure est toujours correcte, mais parfois le div est trop loin vers la gauche ou trop loin vers la droite.

Sur différents ordinateurs (tous avec Windows XP), il fonctionne dans IE8 … comment cela peut-il être? Je l'ai également testé sur mon Mac, OS 10.5. Il fonctionne dans Firefox, mais pas Safari.

J'ai désactivé les plug-ins, les résolutions d'écran modifiées, les fenêtres redimensionnées … Il fonctionne parfois de façon incompatible dans certains endroits parfois.

Est-ce que quelqu'un peut penser à quelque chose que je manque?

MISE À JOUR : J'ai repris mon code pour utiliser l'autocomplète fournie avec jQuery 1.4.2 et jQuery UI 1.8rc3. Il est encore cassé, même problème. Aidez-nous!

MISE À JOUR 2 : voir cette question . JQuery UI autocomplete se casse car il utilise offset. Quelqu'un at-il un travail autour?

Voici le javascript de la fonction d'autocompliement UI qui se déclenche:

 .css({ top: (offset.top + this.element.height) + 'px', left: offset.left + 'px' }) 

Si elle est changée en top: '0px', left: '0px' ça marche bien, mais est évidemment positionné au mauvais endroit.

J'ai finalement compris ce qui se passait. J'ai eu une règle css définissant la largeur du corps:

 body { width: 900px; } 

Une fois que j'ai changé ceci en width: 100%; Et a inclus la page entière dans un div de largeur 900px, cela a fonctionné comme prévu.

Il semble que IE utilise l'élément du corps pour mesurer les valeurs supérieure et gauche pour offset() , mais utilise le bord de la fenêtre pour mesurer les distances supérieure et gauche lors du positionnement absolu d'un élément.

J'espère que cette réponse sauvera quelqu'un d'autre tout le temps que j'ai perdu à ce sujet …

J'ai rencontré une question semblable, j'ai finalement découvert que la propriété float affecte en relative , rendant le div relative n'est pas stable dans Internet Explorer 8 mais fonctionne bien dans Firefox.