Hi, ich hab' vor kurzem etwas ähnliches programmiert und denke mal, daß es Dir helfen wird.
GetHeightWidthOnLoad
Code:
<html>
<head>
<title>Malleus' Image-Loading Test mit "onload"</title>
<script language="JavaScript" type="text/javascript">
<!--
function doIt()
{
var newImage = new Image();
newImage.onload = function ()
{
getHeightWidth( this )
};
newImage.src = "http://www.javascript-spielereien.de/miscs/movezoom/Gretel02.jpg";
getHeightWidth( newImage );
}
function getHeightWidth( newImage )
{
if (newImage.alreadyLoaded || newImage.width == 0)
return true;
breite = newImage.width;
hoehe = newImage.height;
newImage.alreadyLoaded = true;
alert(breite + ":" + hoehe);
document.getElementById( "myDiv" ).appendChild( newImage );
}
//-->
</script>
</head>
<body>
<input type="button" value="Lade Bild mit dem Onload-Event" onclick="doIt()"/>
<div id="myDiv"></div>
</body>
</html>
Erklärung: Du "mußt" einen onload-Handler schreiben, der nach dem Laden des Bildes automatisch aufgerufen wird. Erst zu diesem Zeitpunkt hast Du Höhe und Breite. Da das Setzen der "SRC" asynchron abläuft, also die Programmausführung direkt weiterläuft, ist Höhe und Breite "meistens" 0.
Das Onload feuert aber bei manchen Browers nicht immer (Cache). Aus diesem Grund rufe ich diese Funktion nochmal manuell auf und überprüfe, ob Höhe und Breite ungleich "0" sind. Wenn ja, setze ich ein Flag, das dann später von "richtigen" Onload-handler überprüft wird.
Okay?
Wenn nicht, einfach nachfragen
tschau
Frank
