Obtenga la altura natural de cada imagen con jQuery

1 minuto de lectura

Tengo que leer la altura natural de cada imagen y debo hacer cálculos. Sin embargo, tengo algunos problemas con la lectura a altura natural.

$('div.imgkirp img').each(function(){
    console.log($(this).naturalHeight);
});

Obtiene: (número de imágenes) indefinido en el registro de la consola. ¿Cómo puedo leer la altura natural de cada una de las imágenes?

Trate de usar la propiedad naturalHeight de imagen, usando el prop metodo de la jQuery

$('div.imgkirp img').each(function(){

   console.log($(this).prop('naturalHeight'));
});

  • Intenté esto también y no funcionó para mí. Devuelve ‘indefinido’.

    – David Rhoderick

    3 abr 2017 a las 18:16

  • @ArtlyticalMedia deberías usar load. Porque si la imagen no está cargada, puede ser devuelta “indefinida”.

    -Wallace Maxters

    9 de noviembre de 2017 a las 10:46

avatar de usuario
Rohan

var image = new Image();
image.src = $(this).attr("src");
alert('width: ' + image.naturalWidth + ' and height: ' + image.naturalHeight);

Este enfoque no funciona en IE 8 y versiones anteriores, porque no admite las propiedades ‘naturalWidth’ y ‘naturalHeight’. Para lograr el mismo uso de este código

var image = new Image();
image.src = $(this).attr("src");
image.onload = function() {
console.log('height: ' + this.height);
};

  • Esto simplemente no funciona. Lo he probado en Chrome y puedo ver que la fuente es correcta; Lo configuré en la propiedad src de la nueva imagen y naturalHeight/naturalWidth ‘indefinido’.

    – David Rhoderick

    03/04/2017 a las 18:15


¿Ha sido útil esta solución?