ancho de regresar 0 en jQuery

Question

i tiene una secuencia de comandos de jQuery que se ejecuta después de que la ventana se ha cargado

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

    }); 
}); 

siempre me dan un "no" de esto cuando sé que algunas de las imágenes debe ser un "sí". Cuando rastreé el script en Chrome noté que el $(this).width() siempre devuelve un 0. ive busqué en Google y algunas sugerencias fueron que las imágenes no se cargaron, pero aquí he usado el método window.load que pensé que debería ejecutarse una vez que todo se haya cargado. ¿¿algunas ideas??

gracias por cualquier ayuda de antemano

Answer 1

Chrome es extraño con los anchos de imagen. Me di cuenta cuando construí una galería de fotos de jQuery. Si el ancho de su imagen no está establecido específicamente en la etiqueta, Chrome devolverá 0. FF, e IE calculará el ancho, pero Chrome no lo hará. Intenta establecer el ancho y ver si obtienes el resultado deseado.

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

Answer 2

El método a utilizar, para ejecutar las secuencias de comandos después de la dom ha terminado de cargar, es:

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

Answer 3

tratar

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

Answer 4

intente agregar un evento de carga en la imagen, por lo que solo se ejecutará cuando la imagen esté completamente cargada.

$(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"); 
     } 
    }) 
    }); 
}); 

también se puede intentar comprobar this.complete en el objeto de imagen

Answer 5

que necesita para ejecutar su código cuando se carga la imagen, el siguiente código debería funcionar:

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

tenga en cuenta que todos los elementos DOM que tienen algún tipo de recurso web asociado a (ventana, img, iframe) responden al evento .load().

Answer 6

Solo quería agregar que también debe asegurarse de que su imagen sea en realidad un elemento visible. He tenido muchos problemas en el pasado tratando de medir elementos visibles: ocultos o de visualización: ninguno. Si usted es de hecho intentando medir un elemento oculto, puede superarlo haciendo algo como

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

Ahora que el código es muy vaga, pero le da mi pensamiento detrás de parpadeo visibilidad.