Java Script Bild1 durch Bild2 ersetzten wenn Bild 2 fertig geladen

S

Swyti

Mitglied
Thread Starter
Dabei seit
18.03.2004
Beiträge
61
Reaktionspunkte
0
Hallo Forum,

ich suche jetzt schon seit gut 2 Stunden im Netz und finde nicht das was ich brauche. Java Scripts zum vorausladen von Bildern gibt es viele, aber ich suche etwas bestimmtes!
Ich habe auf meiner Internetseite sehr große Bilder (2-3MB). Nur hat der ein oder andere kein DSL o.ä.
Ich möchte jetzt ein AniGif (60KB) in die Seite einbinden und anschließend wenn die große Bilddatei geladen ist durch diese ersetzten.
Ein Script habe ich bereits in Verwendung, allerdings funktioniert dieses nur nach voreingestellten Millisekunden.
Ich möchte aber das AniGif nur solange Zeigen wie der Ladevorgang auch wirklich dauert.

Hier der Quellcode für die fixen 5000 Millisekunden

<html>
<head>
<script type="text/javascript" language="JavaScript">
<!-- Begin
var preload = new Image();
preload.src = "DPP3NewY1_2.png"; // hier URI Image2 eintragen

function TauscheBild() {
document['ErstesBild'].src = preload.src;
}
// End -->
</script>
</head>
<body onLoad="setTimeout('TauscheBild()', 5000);">
##
<img border="0" name="ErstesBild" src="preloader.gif" width=1010 height=691>
##
</body>
</html>

Was muss ich ändern, damit das preloader.gif nur solange angezeigt wird die das Bild DPP3NewY1_2.png geladen ist?

Vielen Dank im Voraus.
 
Ich glaube du kannst das bsp von selfhtml nehmen, das erste bsp zeigt dir schön wie man auf klick das bild austauscht. du machst halt statt mit klick, in onload

example selfhtml
 
Der Event-Handler onload ist nur fuer <frameset> und <body> erlaubt:
http://de.selfhtml.org/javascript/sprache/eventhandler.htm#onload

Ja, und? Das ist doch was der TS will. Man ruft die Seite auf, bekommt Bild1 zu sehen, und startet automatisch in body onload dann den "download" und zeigt dann Bild2 an.

Wobei ich das schon sehr fraglich finde, Bilder von 2-3MB anzubieten. Normalerweise würde ein vielleicht höchstens 200-300kb Bild ausreichen. Erst wenn er es in voller Pracht sehen will, muss er aktiv drauf klicken und kann sich dann dann mit 3MB anschauen/runterladen. Wenn da ein Bild 2-3MB gross ist, und paar Bilder existieren, würde ich die Seite höchtens 1x aufrufen und dann nie wieder. Mal ohne Spass.
 
Bilder mit einem span-Tag umschließen und auf den Tag als CSS-Eigenschaft:

Code:
background: transparent url('animated.gif') 50% 50% no-repeat;

Dann sieht man so lange das Hintergrundbild, bis das eigentliche Bild geladen ist.
 
Vielen Dank ihr Lieben

aber ich habe die ganze Sache jetzt mit einem Flash-Preloader erledigt. Meine Überlegung war dahingehend, dass Flash nicht auf jedem Rechner installiert ist, aber wenn JAVA abgeschaltet ist, kommt es zum gleichen Effekt.

Trotzdem vielen Dank an euch. Ich werde mir eure Tipps auch noch einmal anschauen und vielleicht beim nächsten Projekt verwenden.

Danke.

swyti
 
Zurück
Oben Unten