✔ Bild austauschen (Klick auf Hyperlink)

I

Identität

Erfahrenes Mitglied
Folgendes möchte ich realisieren:
Ich habe eine Grafik und darunter befindet sich ein Textlink. Wenn ich über diesen Link fahre (MouseOver), soll die Grafik zu Grafik2 werden. Wenn ich dann wieder runter gehe (MouseOut), soll Grafik2 wieder zu Grafik werden. Wenn ich dann den Textlink anklicke, soll Grafik2 dauerhaft eingeblendet werden.

Soweit so gut, wenn ich den Link anklicke, wird natürlich MouseOut ausgeführt und die normale Grafik wird wieder angezeigt. Kann mir jemand helfen? Unten ist der Quelltext:

HTML: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<title>Startseite</title>
	<script type="text/javascript" language="JavaScript">
	<!--
	function swap(Bildname,BildURL)
	{
	document.images[Bildname].src = BildURL;
	}
	//-->

</script>
<script type="text/javascript" language="JavaScript">
	<!--

	Tauschbild01a = new Image();
	Tauschbild01a.src = "./images/grafik1.gif";     /* normale-Grafik */
	Tauschbild01b = new Image();
	Tauschbild01b.src = "./images/grafik2.gif";     /* Highlight-Grafik */


	function Wechseln(Bildname,Tauschbildname)
	{
	document.images[Bildname].src = eval(Tauschbildname + ".src")
	}

	//-->
</script>

</head>
	<body>
		<img name="bild02" src="./images/grafik1.gif"><br>
		<ul id="menue">
			<li><a href="javascript:swap('bild02','./images/grafik2.gif')" OnMouseover = "Wechseln('bild02','Tauschbild01b')" OnMouseout  = "Wechseln('bild02','Tauschbild01a')">» Klick</a></li>
		</ul>

	</body>
</html>

Ist sau wichtig für mich, wäre echt genial wenn mir wer helfen könnte.
 
Nimm dir einfach eine Hilfsvariable.

Javascript: 
<script type="text/javascript" language="JavaScript">
	<!--
        var foobar = true;

	function swap(Bildname,BildURL)
	{
	    document.images[Bildname].src = BildURL;
            foobar = false;
	}
	//-->

</script>
<script type="text/javascript" language="JavaScript">
	<!--

	Tauschbild01a = new Image();
	Tauschbild01a.src = "./images/grafik1.gif";     /* normale-Grafik */
	Tauschbild01b = new Image();
	Tauschbild01b.src = "./images/grafik2.gif";     /* Highlight-Grafik */


	function Wechseln(Bildname,Tauschbildname)
	{
            if(!foobar)
                return;

	    document.images[Bildname].src = eval(Tauschbildname + ".src")
	}

	//-->
</script>

Was genau sucht dort das "eval"?
 
Perfekt!

Vielen Dank, CPoly. Ich bin echt noch ziemlich am Anfang mit JS, aber das habe ich nun verstanden, so wie du vorgegangen bist.

P.S. Coole Page hast du :)
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück