Gibt es in HTML/JavaScript eine Möglichkeit, das endgültige Layout eines Bildes zu bestimmen, wenn das Bild geladen wird?

Question

Ich habe ein Skript, das Elemente untersucht und alle Elemente gleich der Höhe des höchsten Elements der Menge macht. Dies funktioniert gut, außer wenn Bilder eine Weile brauchen, um geladen zu werden, weil die Höhen bereits eingestellt wurden.

Um dies zu überwinden, habe ich einen onload-Listener zum img-Tag hinzugefügt und nachdem das Bild vollständig geladen wurde, setzt es die Höhe von allem korrekt zurück.

Jetzt ist das Problem, wenn es ein besonders großes Bild oder langsame Verbindung gibt, sehen die Dinge immer noch seltsam aus, während das Bild heruntergeladen wird. Gibt es eine Möglichkeit, dass JavaScript am Anfang des Downloads die ultimative Anzeigehöhe des Bildes erkennen kann, anstatt das Ende?

Answer 1

So etwas sollte funktionieren.

var bigImage = new Image(); 
bigImage.src = "path/to/image"; 
bigImage.onload = function() { 
    //create image tag with dimensions and insert into dom 
    console.log(bigImage.width, bigImage.height); 
}