jQuery Offset () non funziona in alcuni browser, su alcuni computer

Question

Ho un problema di posizionare un elemento in alcuni browser. Sto utilizzando il completamento automatico jQuery trovato qui . I valori di completamento automatico div contenente dovrebbero essere direttamente sotto la casella di testo e allineare perfettamente. Il codice imposta la proprietà css sinistra del div utilizzando la proprietà lasciata generato da $(textbox).offset();

Dopo un-imballaggio il codice per cercare di risolvere il mio problema, ho questa:

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();

Questo sembra che dovrebbe funzionare, e funziona in Firefox. Non funziona in IE8, Chrome. La prima posizione è sempre corretto, ma la a volte il div è troppo spostato sulla sinistra, o troppo a destra.

su computer diversi (tutti con Windows XP), funziona in IE8 ... come può essere? Ho anche provato sul mio Mac, OS 10.5. Funziona in Firefox, ma non Safari.

Non ho disabili plug-in, ha cambiato la risoluzione dello schermo, le finestre di dimensioni ri ... Funziona in modo incoerente in alcuni luoghi a volte.

Qualcuno può pensare a qualcosa che mi manca?

Aggiorna : Ho ri-lavorato il mio codice per utilizzare il completamento automatico in dotazione con jQuery 1.4.2 e jQuery UI 1.8rc3. Si è ancora rotto, lo stesso problema. Si prega di aiutare!

UPDATE 2 : Vedi questa domanda relativa . jQuery UI pause di completamento automatico perché utilizza compensate. Qualcuno ha un lavoro in giro?

Ecco il javascript dalla funzione di completamento automatico di interfaccia utente che interviene su:

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

Se la si sostituisca al top: '0px', left: '0px' funziona benissimo, ma è ovviamente posizionata nel posto sbagliato.

Answer 1

ho finalmente capito cosa stava succedendo. Ho avuto una regola CSS che definisce la larghezza del corpo:

body {
    width: 900px;
}

Una volta che l'ho cambiato a width: 100%; e chiuso l'intera pagina in un div di larghezza di 900px, ha funzionato come previsto.

Sembra IE utilizza l'elemento del corpo per misurare i valori superiore e sinistro per offset(), ma utilizza il bordo finestra quando per misurare le distanze superiore e di sinistra nel posizionamento di un elemento assolutamente.

Spero che questa risposta sarà salvare qualcun altro tutto il tempo che ho sprecato su questo ...

Answer 2

ho incontrato una domanda simile, finalmente scoperto la proprietà float colpisce relative, rendendo il div relative non è stabile in Internet Explorer 8, ma si comporta bene in Firefox.