Comment obtenir les vraies dimensions d'une image dans Safari et Chrome ?

Obtenir les vraies dimensions d'une image dans Safari et Chrome

Lors de la création d'un plugin jQuery, extraire la largeur et la hauteur réelles d'une image est crucial. Cependant, l'utilisation des méthodes standard "width()" et "height()" donne des valeurs nulles dans les navigateurs WebKit comme Safari et Chrome.

Pour résoudre ce problème, il est recommandé d'exploiter l'événement "onload" d'une image au lieu de délais d'attente. Cette technique consiste à créer une copie en mémoire de l'image pour éviter les interférences CSS.

var img = $("img")[0]; // Get my img elem
var pic_real_width, pic_real_height;
$("<img/>") // Make in memory copy of image to avoid css issues
    .attr("src", $(img).attr("src"))
    .load(function() {
        pic_real_width = this.width;   // Note: $(this).width() will not
        pic_real_height = this.height; // work for in memory images.
    });

Alternativement, les attributs "naturalHeight" et "naturalWidth" de HTML5 peuvent également être utilisés.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!