Bildhöhe mit jquery in Chrom Problem

Question

$('img').height() gibt 0 in Chrom zurück, aber es gibt die tatsächliche Höhe in IE und Firefox zurück.

Was ist die tatsächliche Methode, um die Höhe des Bildes in Chrom zu erhalten?

Answer 1

Meine Annahme ist, dass diese Funktion aufgerufen wird, bevor das Bild fertig geladen ist. Können Sie versuchen, die Funktion zu verzögern, um festzustellen, ob dies tatsächlich der Fall ist? Wenn dies der Fall ist, können Sie mit einem Timer schummeln, bevor Sie die Funktion ausführen.

Es ist etwas komplizierter festzustellen, wenn ein Bild geladen wurde. Have a look at this script for some ideas - vielleicht würde es für dich arbeiten.

Answer 2

Versuchen Sie es mit einem Bild-Pre-Loader, here's one Ich schrieb für eine Antwort auf another question.

Answer 3

Wie Josh erwähnt, wenn das Bild noch nicht vollständig geladen ist, wird jQuery nicht wissen, was die Dimensionen noch sind. Versuchen Sie so etwas wie dies, um sicherzustellen, Sie versuchen, nur den Zugriff auf es Dimensionen, nachdem das Bild vollständig geladen ist:

var img = new Image(); 

$(img).load(function() { 
    //-- you can determine the height before adding to the DOM 
    alert("height: " + img.height); 
    //-- or you can add it first... 
    $('body').append(img); 
    //-- and then check 
    alert($('body img').height()); 
}).error(function() { 
    //-- this will fire if the URL is invalid, or some other loading error occurs 
    alert("DANGER!... DANGER!..."); 
}); 

$(img).attr('src', "http://sstatic.net/so/img/logo.png"); 

Answer 4

Ein etwas hässlich, aber effektive Update, das ich verwenden, war eine Back-End-Sprache verwenden, in meinem Fall php, um die Höhe zu ermitteln und auf das Bild zu setzen, bevor Sie es an den Browser senden.

es ist hässlich, aber einfach und schnell

Answer 5

das Bild im Voraus laden und eine Rückruffunktion einrichten könnte, was Sie suchen:

// simple image preloader 
function getHeight(el,fn) { 
    var img = new Image(); 
    img.onload = function() { fn(img.height); }; 
    img.src = el.attr("src"); 
} 

$("img").each(function(){ 
    getHeight($(this),function(h){ 
     // what you need to do with the height value here 
     alert(h); 
    }); 
}); 

Answer 6

Gerade hatte das gleiche Problem: Stellen Sie die Breite und Höhe vorher über CSS oder HTML.

Answer 7

Nachdem nur einige Versuche gemacht mit diesem habe ich gefunden, dass

$(this).height(); 

Gibt 0 zurück - aber wenn Sie einfach nur alte JS

verwenden

this.height; 

ich die richtige Bildhöhe erhalten.