Bildzeiger [IE|M|O|G]

von: Werner Zenk

Eine Funktion die Bilder anzeigt, wenn auf einen Link geklickt wird.

Beispiel: Bild 1 - Bild 2 - Bild 3

Beispiel:

Quelltext:

spacer.gif =  (Transparent)

<script type="text/javascript">
 function bild1() { document.getElementById("Leinwand").style.backgroundImage="url(1.jpg)";}
 function bild2() { document.getElementById("Leinwand").style.backgroundImage="url(2.jpg)";}
 function bild3() { document.getElementById("Leinwand").style.backgroundImage="url(3.jpg)";}
</script>

<style type="text/css">
.Rahmen{
 background-repeat: no-repeat;
 background-position: center center;
}
</style>

<body onLoad='document.getElementById("Leinwand").style.backgroundImage="url(3.jpg)";'>

<div align=center>
<table border="0" id="Leinwand" class="Rahmen">
<tr><td><img src="spacer.gif" width=195 height=195></td></tr>
</table>

<a href="javascript:bild1();">Bild 1</a> - 
<a href="javascript:bild2();">Bild 2</a> - 
<a href="javascript:bild3();">Bild 3</a>
</div>

Anmerkung: Passen Sie das spacer.gif an die Größe der Bilder an, die Sie zeigen möchten.

Und Ihre Meinung? Sie vermissen auf dieser Seite wichtige Informationen oder haben Hinweise für uns?

christian: ich versteh das nicht in welches feld muss man den link des bildes einsetzen? Werner: Setze den Link in das Javascript hinein! Beispiel: 1.jpg Richard: an welcher Stelle genau muss die Bild-url eingesetzt werden ? Werner: Bei diesem JS-Code; einwand").style.backgroundImage="url(MEINBILD.jpg)";} Mario: Hallo, es ist sehr gut zu gebrauchen! Es wäre aber noch besser, wenn man optional einen Untertitel zu jedem Bild hinzufügen könnte. Gruß Mario dirk: habe das script etwas umgeschrieben (im prinzip geht es darum, dass ich die thumbs links habe und das große bild rechts), das klappt leider nicht. außerdem habe ich unterschiedl große bilder (hoch-/querformat). geht das mit der fixen größe des spacer.gif nicht? und: muss das spacer.gif unbedingt in ein table (hat bei mir schwierigkeiten bereitet)? DANKE!
Hilfe finden Sie im » netzgemein.de - Forum. Auch als „Gast” können Sie dort Fragen stellen!

Das könnte Sie interessieren:

Startseite festlegen

JavaScript und PHP verbinden

Webseite automatisch aktualisieren - Die Seite wird automatisch alle 20 Sekunden aktualisiert.

Seite scrollen - Dieses Script scrollt die Seite bis zur angegebenen Position.

Webseite autom. jede Minute neu laden

Zwei Frames gleichzeitig ändern (2)

JavaScript-Ausgabe zeitlich steuern

Fenster on Top - Dieses Script bewirkt das sich das Fenster in gewissen ...

Wertübergabe an eine andere Funktion

jQuery - jQuery ist ein freies, umfangreiches JavaScript-Framework, das komfortable Funktionen zur DOM-Manipulation und -Navigation zur Verfügung stellt. …mehr