Zwei Bilder laden innerhalb einer Funktion
Martin Miethke
- javascript
Guten Abend alle miteinander,
in einem Iframe wird eine Leiste mit Thumbnails dargestellt; Klick auf ein Thumbnail soll (per JavaScript) das betreffende Bild in ein Bildobjekt im übergeordneten HTML-Dokument laden. Gleichzeitig soll darunter in einem Absatz der dazugehörige Text erscheinen (wer's sehen will: URL s.o.).
Das funktioniert eigentlich sehr gut; aber bei einer langsamen Verbindung dauert es eine Weile, bis nach einem Klick das nächste Bild geladen wird, während der neue Text sofort da ist. Da ich das ziemlich verwirrend für die Betrachter finde, habe ich ein einfaches GIF in der gleichen Größe erstellt (loading.gif), das einfach nur den Text "Bild wird geladen" zeigt. Dieses Bild soll nun mit der Funktion, die das "richtige" Bild lädt, zuvor geladen werden:
function show(i) {
imgName = "bilder/loading.gif";
txt = "";
parent.show(imgName, txt);
imgName = path + "IMG_" + imgs[i].slice(0,4) + ".jpg";
txt = imgs[i].slice(5);
parent.show(imgName, txt);
}
Die Funktion show(imgName, txt) im übergeordneten Dokument sieht so aus:
function show(imgName, txt) {
document.bild.src = imgName;
document.getElementById("BU").innerHTML = txt;
}
Leider funktioniert das nicht so wie gewünscht, denn loading.gif wird überhaupt nicht angezeigt. Das Verhalten nach einem Klick auf ein Thumbnail ist so, als ob die ersten drei Zeilen der Funktion show(i) einfach übersprungen würden.
Wo liegt der Fehler?
Herzliche Grüße
Martin
Hi,
Leider funktioniert das nicht so wie gewünscht, denn loading.gif wird überhaupt nicht angezeigt.
In meinem Opera schon - Firefox und IE 7 tun's allerdings nicht - erst wenn ich das Bild "manuell" vorlade, in dem ich es in einem extra Tab oeffne, dann zeigen die es auch an.
Wo liegt der Fehler?
Lade das Bild vor, so dass die Browser es im Cache haben.
MfG ChrisB
Lade das Bild vor, so dass die Browser es im Cache haben.
Hallo Chris,
guter Tip, Danke! Jetzt funktioniert's im IE, aber im Firefox leider immer noch nicht :-( Was macht der denn anders?
Herzliche Grüße
Martin
Hi,
guter Tip, Danke! Jetzt funktioniert's im IE, aber im Firefox leider immer noch nicht :-(
Also in meinem (2.0.0.13) schon ...
(Cache geloescht, um zu verhindern, dass er das Bild von meinem vorherigen Versuch von dort holt.)
MfG ChrisB
(Cache geloescht, um zu verhindern, dass er das Bild von meinem vorherigen Versuch von dort holt.)
Ach so - daran lag's :-) Nochmal Danke!
Martin
Grüße,
zu beginn meiner coderzeit, hab eich es so gemacht - eine tabelle oder div, mit alen bildern drin und weit abseits der sichtbaren documentgrenzen. danach fragte ich es per dings.src=dings_1.src ab - aber sollten es viele bilder werden wirds monströs >_< denn langsame verbindung wird dazu führen dass man erst warten muss bis alle bilder geladen sind (was manche browser nach ein paar minuten abbrechen konnten - führt zu unvollständig geladenen bildern) anstatt dass man nach jedem click ein paar secunden wartet.
wie human deine sorge um die modemuser auh ist - um eine bestimmte menge an daten zu übertragen hat man bestimmte zeit zu warten - du kanns tnur entscheiden ob mans häppchenweise oder auf einmal tut^^
MFG
bleicher