Bilder gleichzeitig anzeigen

  • Themenstarter Themenstarter stender23
  • Beginndatum Beginndatum
S

stender23

Guten Tag zusammen,

habe folgendes Problem:

Ich lade ein Bild in eine Tabelle, an der unten und rechts ein Schatten in Form von zwei weiteren Bildern angefügt wird. Da die Dateigrößen der Schattenbilder natürlich kleiner sind, werden diese dargestellt, obwohl das eigentliche Hauptbild noch lädt.

Gibt es ein Skript, dass alle drei Bilder erst anzeigt, wenn alles geladen ist?

Es sollte wie ein Bild aussehen.

Vielen Dank

Stender23
 
Hallo

da habe ich schon geguckt. Habe nur das Problem das diese Bildseiten dynamisch erzeugt werden und ich erst beim Aufruf weiß, was geladen werden müßte.

Dann ist vorladen doch schwierig, oder?

Danke schon mal

Stender23
 
Habe jetzt schon einige Preload-Funktionen probiert. Ich kriege es aber irgendwie nicht hin

So sieht meine Funktion aus:

Code: 
<script language="JavaScript">
<!--
var preloadFlag = false;
function preloadImages() 
{
if (document.images) 
{
bild01 = new Image();bild01.src="bild.jpg";
bild02 = new Image();bild02.src="/image/unten.jpg";
bild03 = new Image();bild03.src="/image/rechts.jpg";
preloadFlag = true;
}
}
//-->
</script>
Und so rufe ich das Bild auf:

Code: 
<img onLoad="preloadImages();" src=bild.jpg">
<img src=image/unten.jpg">
<img src=image/rechts.jpg">

Warum funktioniert es nicht? So habe ich es aus anderen Themen.

Mfg
Stender23
 
Wenn du alle 3 Bilder beim onload des <body> anzeigen lässt, dann sind sie auch geladen.

Ansonsten... per "onload" kann man auch ermitteln, ob ein Bild fertiggeladen ist.... wenn du nicht auf das Laden der ganzen Seite warten willst.

Der Preloader ist überflüssig... die Bilder stehen in der Seite... da braucht man keinen Preloader.
 
Hallo Sven

danke schon mal. Genau so meinte ich das auch. War nicht meine Idee mit dem Preloader.

Wie genau geht das mit dem body-Tag? Muss ich alle grei Grafiken dort aufführen?

<body onload="bild.jpg"...>?

Wäre dankbar für eine Hilfestellung.

Mfg
Stender23
 
Hallo Sven

vielen dank noch einmal. Du hast mich auf den richtigen Weg gebracht. Es funktioniert genau so wie ich wollte.

Falls es noch jemand braucht, so geht`s;

Beim Seitenaufruf

Code: 
<BODY onload="bildladen();">

Die Funktion

Code: 
function bildladen()
{
if (document.bild.complete == true)
{ 
document.bild.style.visibility = "visible";
document.unten.style.visibility = "visible";
document.rechts.style.visibility = "visible";
}
}

Die Bilder

Code: 
<img style="visibility:hidden" src="bild.jpg" name="bild">
<img style="visibility:hidden" src="unten.jpg" name="unten">
<img style="visibility:hidden" src="rechts.jpg" name="rechts">

und so siehts aus(wenn`s interessiert):

http://www.feuerwehr-heiden.de/view.php?id=1110301429

Mfg
Stender23
 
Einen Tipp habe ich noch:

Wenn man JS deaktiviert hat, bekommt man die Bilder nie zu Gesicht.

Lösung: man schreibt per write() einen <style>-Block in den <head> der Seite und notiert dort visibility:hidden für die Bilder.

Übrigens brauchst du die ccomplete-Eigenschaft der Bilder dabei nicht abfragen... wenn onload im <body> feuert, ist alles fertiggeladen, was sich darin befindet.

Man könnte auf die Weise z.B. auch bequem auch die ganze Seite erst dann anzeigen lassen, wenn alles geladen ist....indem man die visibilty des <body> ändert ;)
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück