Bild mit klick im gleichen Fenster öffnen

[grasi]

Hi Leute,

hab da eine totale javascript frage...
also, ich habe ein fenster mit 2 Bereichen - Linke Hälfte / Rechte Hälfte der seite.
in der Linken Hälfte habe ich die Links. In der Rechten Hälfte sollen jeweils die Bilder angezeigt werden, die ich über die Links anklicke.
Hoffe es einigermaßen verständlich erklärt zu haben. Bei einem klick auf den link soll also kein neues Fenster mit dem Bild aufpopen, sondern im gleichen Fenster in der rechten hälfte erscheinen.
Wie es gemeint ist kann man auch hier sehen.


wie erreiche ich so etwas mit javascript
Vielen Dank für Antworten!!

 

[con-f-use]

Erstmal ein paar Grundlegende Sachen, weil du neu hier bist. Bitte nicht falsch verstehen, ist nicht böse gemeint:

Unser Forum ist kein Chatroom. [...] Jugendsprache, regional verbreitete Dialekte und durchgehend kleingeschriebene Beiträge sind [...] unerwünscht.

Quelle: http://www.tutorials.de/index.php?pg=netiquette

Du hast diesen Regeln beim Registieren für das Forum zugestimmt, also halte dich bitte auch dran. Danke!

Ebensowenig ist es Sinn des Boards, das Basiswissen einer bestimmten Sprache zu vermitteln.
Dafür gibt es mannigfaltige Adressen im Web, die sich dies zur Aufgabe gemacht haben und sehr gut tun.

Quelle: http://www.tutorials.de/forum/javascript/215197-keine-ahnung-von-javascript.html

Deine Frage behandelt absolutes Javascript-Grundwissen. Dieses Forum ist nicht da um Grundwissen zu vermitteln, sondern um dir bei konkreten Problemen zu helfen, die das Beherrschen der Basics einfach voraussetzten (müssen).

Am besten du lierst dir nochmal die beiden Links durch, die ich als Quelle angegeben habe.

---------------------------------------------------------------------------------------------------------------------------

Nun zu deinem Problem:
Du musst zuerst mal das eine Bild, dass du ändern willst über das Document Object Model (DOM) ansprechen. Was du verändern willst ist das src-Attribut (damit ein anderes jpg angezeigt wird). Du brauchst also noch die Methode setAttribute().

Da man aus Beispielen am besten lernt hier ein Kleines:

<script type="text/javascript"><!--
function aendern(bild) {
    document.getElementById('Anzeige').setAttribute('src',bild);
    return false;
}
//-->
</script>

<img src="Anfag.jpg" id="Anzeige" /><br />

<a href="Bild1.jpg" onclick="return aendern(this.href)">Bild1</a><br />
<a href="Bild2.jpg" onclick="return aendern(this.href)">Bild2</a><br />
<a href="Bild3.jpg" onclick="return aendern(this.href)">Bild3</a><br />
<a href="Ende.jpg" onclick="return aendern(this.href)">Ende</a>

Hab das ganze noch in eine Funktion gepackt und es einwenig rafinierter gemacht. Ohne die funktion könnte auch im onclick " document.getElementById('Anzeige').setAttribute('src','Bild1.jpg'); return false;" usw. stehen und es würde funktionieren. Hab das Script aber nicht getestet, könnte noch kleiner Tipp- oder Denkfehler enthalten.

 

[grasi]

Vielen Dank!

Sorry, wegen der Frage..
Habe mir die Regeln so muss ich zugeben erst jetzt durchgelesen...
Werde das Script mal testen und nur noch weitere Fragen stellen, wenn ich ein wenig Grundwissen habe

gruß
Grasi

 

[con-f-use]

Hab das Script nochmal kurz editiert, weil mir aufgefallen war, dass ich das "return false" in der Funktion vergessen hatte.