2013-03-27 3 views
7

Per qualche motivo, $("...").width() restituisce il valore errato immediatamente dopo la consegna del documento.jQuery width() errato immediatamente dopo la fine del documento?

Sono vedere questi valori:

subito dopo documento pronto:

$(document).ready(function(){ 
    $("li.active a").width() //returns 76 - incorrect 
}); 

$(document).ready(function(){ 
    $(window).load(function(){ 
    $("li.active a").width() //returns 59 - the correct value 
    }); 
}); 

$(document).ready(function(){ 
    setTimeout(function(){ 
    $("li.active a").width() //returns 59 - the correct value 
    }, 100); 
}); 

sto ottenendo la larghezza delle voci di menu wordpress e il ridimensionamento in modo che sempre in forma nella mia responsive design. Non ci sono immagini o risorse che dovrebbero causare questo cambiamento.

Aggiornamento Vedere il mio commento qui sotto. Abbiamo scoperto che c'era una risorsa, un carattere incorporato, che impiegava una frazione di secondo per caricare.

risposta

15

Potrebbe essere a causa della mancanza di $(window).load nel primo esempio.

"L'eventodocumento pronto esegue già quando il documento HTML è caricato e il DOM è pronto, anche se tutti gli elementi grafici non hanno ancora caricato . Se si desidera collegare i vostri eventi per alcuni elementi prima di carica la finestra, quindi $ (documento) .ready è il posto giusto. " *

$(document).ready(function() { 
// executes when HTML-Document is loaded and DOM is ready 
alert("document is ready"); 
}); 

"Il finestra carico evento esegue un po 'più tardi, quando la pagina completa è pieno carico, compresi tutti cornici, oggetti e immagini. Pertanto funzioni che le immagini riguardano o altri contenuti della pagina devono essere inseriti nell'evento di caricamento per la finestra o il tag di contenuto stesso. " *

$(window).load(function() { 
// executes when complete page is fully loaded (all frames, objects and images) 
alert("window is loaded"); 
}); 

* citazioni provengono da 4loc.

+6

L'ho capito ... Sto usando un carattere incorporato nel menu. La larghezza dell'elemento dom è determinata dal carattere predefinito del browser fino a quando il carattere non è completamente caricato. In qualche modo la tua risposta mi ha ricordato il carattere incorporato! – orourkedd