Bildwechsel ohne Mousover sonder bei klick auf Link !

Status
Nicht offen für weitere Antworten.

Silveronair

Grünschnabel
Hallo, ich habe eine Seite gefunden und dort ist ein tolles Bildwechselverfahren. Wenn ich also auf ein link klicke ändert sich das bild im selben fenster und dazu suche ich einen Script.

Danke im vorraus für jede Hilfe.


Ps.: noch die SeiteHier
 
Hi,
in der Webmaster Faq ist ein Beispiel für eine Bildwechsel bei Mouseover.
Damit er erst bei einem Klick das Bild wechselt nimmst du statt dem onmouseover Event Handler onclick.
 
Mein Problem ist aber das ich mehrere Bilder auf einer seite verlinken will, also so wie auf der Beispielseite. Sprich ohne das ich alle bilder erst im Script einfügen muss.

Bei der Beispiel seite sieht das Script so aus:

//-->
</script>

<script language="JavaScript">
<!--

function changeOutfitImage(whichImage){
document.imgChange.src=whichImage;
}

//-->
</script>


<tr>
<td><a href="javascript:changeOutfitImage('Decorated Belt.jpg')">Decorated
Belt</a></td>
<td> 2.5k</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>

Nur weiss ich nicht wie ich das umändern bspw. wissen muss, das ich es für meine eigene Seite verwenden kann.
 
Hi!

Hm, ich habe keine Ahnung, was Du nun wissen möchtest :(
Denn, Du hast doch alles bereits zusammen:

Du hast im code ein Bild Namens "imgChange":
<IMG SRC="startbild.jpg" NAME="imgChange">

Die folgenden Links rufen Javascript auf:
<A HREF="javascript:changeOutfitImage(bildzwei.jpg);">zweitesBild</A>
Heißt also: Procedure changeOutfitImage wird mit dem Parameter "bildzwei.jpg" aufgerufen.

Die Procedure:
function changeOutfitImage(whichImage) { document.imgChange.src=whichImage;
}
packt den Parameter in die Variable "whichImage" und setzt das Bild "imgChange" darauf.

Wo scheitert's nun?
 
z.B.

<head>
<script>
var bildnr = 1;
var bild = "bild" + bildnr + ".jpg";

function hochzaehlen(){
bildnr +=1;
wechsel();
}

function wechsel(){
parent.frames[0].document.images[0].src = bild;
}

</script>

</head>
<body>

<img src="bild.jpg" bla>

direkt:
<a href="javascript:wechsel();">Bildwechsel</a>
oder
<div onClick="wechsel();">Bildwechsel</div>
oder
oder

weiterblaettern:
<a href="javascript:hochzaehlen();">Bildwechsel</a>
oder
<div onClick="hochzaehlen();">Bildwechsel</div>
oder
oder

</body>


Die Bilder nun "bild1.jpg", "bild2.jpg", "bild3.jpg" benennen
und schon darf froehlich geblaettert werden.
 
Zuletzt bearbeitet:
Alles klaro ;) .

Nach langem überlegen bin ich drauf gekommen, was ich falsch gemacht habe.
Ich wäre aber nicht drauf gekommen, wenn ihr nicht gepostet hättet, dann wärs mir wohl nie aufgefallen.

Vielen dank an euch allen nochmals und eine gute Nacht wünsche euch.


DANKE COMMUNITY :-)
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück