onClick Bilderwechsel

N

non4me

Guest
Hallo!

Ich habe folgendes Problem: Ich möchte, dass wenn ich auf ein Bild klicke ein anderes Bild stattdessen auftaucht. Das ist ja soweit nicht schwer, aber dann möchte ich, dass wenn ich nochmal draufklicke, das erste Bild wieder erscheint.
Also beim ersten Klick kommt das zweite Bild und beim zweiten Klick erscheint wieder das erste.

Das krieg ich nicht hin.:(

Kann mir da jemand helfen?

mfg non4me
 
sry^^


<html>
<head>
<title>Test</title>
</head>
<body>
<script language="JavaScript" type="text/javascript">
<!--
if (document.images) {
bild1 = new Image();
bild1.src = "plus.bmp";
bild2 = new Image();
bild2.src = "minus.bmp";
}
// -->
</script>
<a onclick="if (document.images) self.document.testbild.src=bild2.src">
<img border="0" src="plus.bmp" name="testbild">
</a>
</body>
</html>


Soweit hab ichs... Der erste Bildwechsel funzt ja! Aber einen zweiten einbauen ist für mich n bisschen zu hoch!
 
Code: 
<html>
<head>
<title>Test</title>
</head>
<body>
<script type="text/javascript">
<!--
if (document.images) {
bild1 = new Image();
bild1.src = "plus.bmp";
bild2 = new Image();
bild2.src = "minus.bmp";
}
var img = 0;
function changeImage(){
  self.document.testbild.src = (img? bild1.src : bild2.src);
  img ^= 1;
}
// -->
</script>
<a onclick="if (document.images) changeImage()">
<img border="0" src="plus.bmp" name="testbild">
</a>
</body>
</html>

so?
 
ich hätte das so gemacht...
Code: 
<script type="text/javascript"><!--

var bild1 = "bild1.bmp";
var bild2 = "bild2.bmp";

function ChangePic()
{
 if(document.getElementById('bild').src == bild1)
  document.getElementById('bild').src = bild2;
else
 document.getElementById('bild').src = bild1;

}

//-->
</script>

<a href="#" onClick="ChangePic()">Wechseln</a>
<img src="bild1.bmp" id="bild">
 
KingKoQ schrieb:
ich hätte das so gemacht...
Code: 
<script type="text/javascript"><!--

var bild1 = "bild1.bmp";
var bild2 = "bild2.bmp";

function ChangePic()
{
 if(document.getElementById('bild').src == bild1)
  document.getElementById('bild').src = bild2;
else
 document.getElementById('bild').src = bild1;

}

//-->
</script>

<a href="#" onClick="ChangePic()">Wechseln</a>
<img src="bild1.bmp" id="bild">
Zum Vergrößern anklicken....

Code: 
if(document.getElementById('bild').src == bild1)
wird dich zum scheitern verurteilen, da manche (alle?) browser den kompletten pfad in die src-eigenschaft schreiben!

lösung wäre:
Code: 
if(document.getElementById('bild').src.match(new RegExP(bild1+'$'))!== null)


Code: 
<script type="text/javascript"><!--
var a_plumi = {};
function plumi( id ){
	var obj = document.getElementById( id );
	if( obj ){
		obj.src = (a_plumi[id]?'plus.bmp':'minus.bmp');
		a_plumi[id] = parseInt(a_plumi[id]) ^ 1;
	}
}
//-->
</script>

<a href="#" onClick="plumi('bild');">Wechseln</a>
<img src="plus.bmp" id="bild">

hmm so is bestimmt auch cool, wenns funktioniert (nich getestet)
 
Zuletzt bearbeitet:
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben