El problema radica en el uso incorrecto del operador
this
en tu función. Actualmente,
this
no se refiere a la imagen que estás intentando seleccionar, sino que se refiere al objeto
window
ya que estás en el ámbito global de la función.
Para solucionar esto, deberías iterar sobre las imágenes con un bucle
each
, de esta forma
this
hace referencia a la imagen actual en iteración. Aquí te dejo tu código corregido:
JavaScript:
$(document).ready(function(){
var monitoreo2 = setInterval(function(){
$('.bloqes img').each(function(){
if($(this).width() !== 300) {
alert("Ancho de imagen diferente de 300px!");
$(this).css({
"width":"300px",
"height":"100%",
"float":"left"
});
}
$(this).click(function(){
$("body").css("background", "#000000");
clearInterval(monitoreo2);
});
});
}, 300);
});
Este código comprobará que todas las imágenes en
.bloqes
tengan un ancho de 300px cada 300 milisegundos. Si la anchura es diferente, se disparará una alerta y se modificará el estilo de la imagen. Por último, si se hace clic en la imagen, se cambiará el color de fondo del cuerpo del documento a negro y se dejará de ejecutar la comprobación de anchura.