onload() Problem mit IE

[Bata79]

Hallo zusammen!

Ich habe ein merkwürdiges Problem, welches zwar der Onlinewelt bekannt ist, aber ich irgendwie absolut keine Lösung dafür finde.

Es geht darum ein Bild per Klick auszutauschen und auch dann erst das Bild nachzuladen. Mein Code sieht wie folgt aus:

function togglePic(source) {
            
            // set preload gif
            document.getElementById('bigPic').src = "images/preload.gif";
            
            picture = new Image;
            picture.src = "media/" + source;
            
            // load picture
            picture.onload = function() {
                document.getElementById('bigPic').src = picture.src;
            }
        }

Bei Klick wird also das vorhandene Bild mit 'preload.gif' ersetzt, dann wird das neue Bild geladen und wenn die Prüfung mit onload() true ist wird das Bild ausgetauscht.

Das funktioniert im FF tadellos und im IE auch, allerdings nur ACHTUNG! wenn das Bild noch nicht im Cache liegt sondern neu geladen werden muss.

Kann ich denn irgendwie feststellen ob das Bild nicht doch schon vorliegt? Ich würde nur ungern bereits beim Seitenaufruf alle Bilder vorladen. Falls Ihr keine Idee habt werde ich das wohl mit AJAX machen müssen...

Danke für Eure Hilfe!

 

[Sven Mintel]

Prüfe mal nach dem Zuweisen der src height oder width des Bildes.

Sind diese nicht 0, ist davon auszugehen, dass das Bild schon geladen ist....du kannst es dann anzeigen lassen.(Dies scheint im IE allerdings nur bei HTTP so zu sein, lokal funktioniert das irgendwie nicht)
Die Zuweisung für den onload-Event solltest du besser direkt nach picture = new Image; platzieren.

 

[Bata79]

Vielen Dank Sven!

Ich hatte es erst mit picture.complete versucht, aber das klappt ja wieder nicht bei allen Browsern. Mit height funktioniert es wunderbar!

*close*