Ladebildschirm beim Bilderladen


Bei größeren Bilder dauert das Laden meist etwas. Um dem Benutzer eine Rückmeldung zu geben, zeige ihm einen Ladebildschirm.

Hat man ein großes Bild, so dauert es manchmal eine ganze Weile, bis es geladen ist. und der Benutzer weiß nicht genau, was nun passiert und wartet wahrscheinlich nicht, bis das Bild ausgeladen hat.

Um dies zu verhindern erstelle eine Grafik des Types gif. Es sollte genauso groß sein, wie das Foto selbst und einen einfarbigen Hintergrund haben. Schreibe nun in die Grafik an den unteren Rand eine Bemerkung wie "Foto wird geladen, warte kurz..." oder etwas ähnliches.
Nun ersetze das einfache <img>-Element des großen Fotos folgendes:

Code:
<table cellspacing="0" cellpadding="0" border="0">
<tr><td background="images/hintergrund.gif"><img src="images/foto.jpg" width="800" height="500" border="0" alt=""></td></tr>
</table>


Das Prinzip ist folgendes: Wir setzen die gif-Grafik als Hintergrund einer Tabelle. Da die gif-Grafik so klein ist, ist sie auch schnell geladen und der Besucher wird informiert. Nun lädt langsam das Foto da rüber und überdeckt die gif-Grafik. Einfach und doch effektiv.
Ersetze noch images/hintergrund.gif mit der Adresse zu deiner gif-Grafik, images/foto.jpg mit der Adresse zum großen Foto und width="800" height="500" durch die Höhe (height) und die Breite (width) des Fotos. Wenn du alles richtig gemacht hast, sollte es laufen!Geschrieben von Phil Marx am 18.06.2004 (6342x gelesen)
Diese News stammt von der Seite http://www.yubb.de
Sie ist unter http://www.yubb.de/artikel374.html direkt aufrufbar.

Jegliche Reproduktion dieser Seite oder ihrer Inhalte ist strengstens untersagt.