Sie haben JavaScript deaktiviert. Vermutlich sind Sie ein Kollege und wollen nur sehen, ob meine Website auch ohne JavaScript funktioniert.
Andernfalls: Bitte aktivieren Sie JavaScript!

webdesign weisshart Startseite

zurück zum Standard-Style

Ein Zufallsbild mit einer Zeile HTML

Hinweis:
Dieser Artikel ist älter als 18 Monate / wurde seit 18 Monaten nicht aktualisiert. Dies kann (muss aber nicht) dazu führen, dass der Artikel, und / oder darin beschriebene Techniken, nicht mehr aktuell sind. Bitte berücksichtigen Sie diesen Hinweis bei der Lektüre.

Das folgende Beispiel zeigt ein Zufallsbild zum Thema "office", das bei jedem Seitenaufruf wechselt.

682

Zufallsbild

Der geniale Fotodienst https://unsplash.com stellt eine riesige Auswahl an Fotos zur absolut freien und kostenlosen Nutzung bereit.
Sogar Embedding mit einer einzigen Zeile HTML ist möglich, ohne jegliche Programmierung.

<img src="https://source.unsplash.com/669x471/?office" alt="Zufallsbild" width="675" height="200" >

Einziger Wermutstropfen für Perfektionisten: Die sichtbare Verzögerung von ca. ½ Sekunde, bis das Bild geladen wird.
Zur Verdeutlichung dieser Verzögerung mit dem folgenden Button die Seite neu laden.

Zwischenspeichern der Zufallsbilder mittels PHP

Mit einem Griff in die PHP- und AJAX-Trickkiste lässt sich aber auch diese Verzögerung eliminieren. Bei jedem Aufruf der Seite wird dazu das jeweilige Zufallsbild auf dem Server gespeichert, und das beim vorherigen Seitenaufruf gespeicherte Bild angezeigt.

Zur Demo mit zwischengespeichertem Bild

Creative Commons Lizenzvertrag

Artikeltexte und Code-Snippets: Creative Commons CC BY-SA 4.0
Medien (Bilder, Videos, Audios) sind evtl. urheberrechtlich geschützt.

Kommentare

Über Ihren Kommentar zu diesem Artikel freue ich mich.
Wenn Sie aber Fragen haben, und eine Antwort erwarten, nutzen Sie bitte das Supportforum! Die Nutzung des Forums ist auch ohne Registrierung möglich.

? Anweisungen zur Eingabe von BB Code Wenn Javascript verfügbar ist, können Sie die obigen Schaltflächen zum Einfügen der folgenden Steuercodes verwenden (an der Cursorposition oder um gegebenenfalls markierten Text):

[b]als wichtig <strong>[/b] hervorgehobener Text
[c]Quellcode[/c] oder optisch hervorgehobenes Zitat