larghezza ritorno 0 in jQuery

Question

ho alcuni script di jQuery che corre dopo che la finestra è caricata

$(window).load(function() { 
    $('.picture a img').each(function(index) { 
     $(this).height(280); 
     if ($(this).width() > $(this).height()) { 
      alert("yes"); 
     } else { 
      alert("no"); 
     } 

    }); 
}); 

ottengo sempre un "no" da questo quando so alcune delle immagini dovrebbe essere un "sì". Quando ho rintracciato lo script in chrome ho notato che lo $(this).width() restituisce sempre uno 0. go su Google e alcuni suggerimenti erano che le immagini non sono state caricate ma qui ho usato il metodo window.load che pensavo dovesse essere eseguito una volta che tutto è stato caricato. qualche idea??

grazie per qualsiasi aiuto in anticipo

Answer 1

Chrome è strano riguardo alle larghezze dell'immagine. L'ho notato quando ho creato una galleria fotografica di jQuery. Se la larghezza dell'immagine non è specificatamente impostata nel tag, chrome restituirà 0. FF, e IE calcolerà la larghezza, ma Chrome non lo farà. Prova effettivamente ad impostare la larghezza e vedi se ottieni il risultato desiderato allora.

<img width="200" src="..." /> 

Answer 2

Il metodo corretto da utilizzare, per eseguire i propri script dopo il DOM ha terminato il caricamento, è:

$(document).ready(function() { /*your code here*/ }); 

Answer 3

provare

if ($(this).attr("width") > $(this).attr("height")) {

Answer 4

provare ad aggiungere un evento di caricamento sull'immagine, quindi verrà eseguito solo quando l'immagine è completamente caricata.

$(window).load(function() { 
    $('.picture a img').each(function(index) { 
    $(this).bind('load', function() { 
     $(this).height(280); 
     if ($(this).width() > $(this).height()) { 
      alert("yes"); 
     } else { 
      alert("no"); 
     } 
    }) 
    }); 
}); 

si può anche provare a controllare this.complete sull'oggetto immagine

Answer 5

è necessario eseguire il codice quando l'immagine viene caricata, il codice seguente dovrebbe funzionare:

$(window).load(function() { 
    $('.picture a img').load(function() { 
     $(this).height(280); 
     if ($(this).width() > $(this).height()) { 
      alert("yes"); 
     } else { 
      alert("no"); 
     } 
    }); 
}); 

si noti che ogni elemento DOM che ha una sorta di risorsa Web associata a (window, img, iframe) risponde all'evento .load().

Answer 6

Volevo solo aggiungere che dovresti anche assicurarti che l'immagine sia effettivamente un elemento visibile. Ho avuto un sacco di problemi in passato cercando di misurare il visibile: nascosto o visualizzato: nessun elemento. Se si sta infatti tentando di misurare un elemento nascosto, è possibile ottenere passato facendo qualcosa di simile

var width = $('img').show().width(); 
$('img').hide(); 

Ora che il codice è incredibilmente vago, ma ti dà il mio pensiero dietro visibilità lampeggiante.