Jojoxx.net logotyp

 

 

Användare ikonAnvändare
Besökare just nu: 64
Snabblänkar ikonSnabblänkar
JavaScript-arkivet
Perl
FAQ

Sök på Jojoxx.net


Meny med bildväxling 2

Exempel

Imageswap
Imageswap

Kod


<script type="text/javascript">
/* Detta script finns att hämta på http://www.jojoxx.net och
   får användas fritt så länge som dessa rader står kvar. */

if (document.images) {
	button_1_on=new Image;
	button_1_on.src="images/link1b.gif";
	button_1_off=new Image;
	button_1_off.src="images/link1a.gif";

	button_2_on=new Image;
	button_2_on.src="images/link2b.gif";
	button_2_off=new Image;
	button_2_off.src="images/link2a.gif";

	pic_on=new Image;
	pic_on.src="images/linka.gif";
	pic_off=new Image;
	pic_off.src="images/linkb.gif";

	var re = "pic1_";
}

function rollIn(imgName) {
	if (document.images) {
		document[imgName].src=eval(imgName + "on.src");
	}
}

function rollOut(imgName) {
	if (document.images) {
		document[imgName].src=eval(imgName + "off.src");
	}
}

function acti(imgName) {
	if (document.images) {
		document[re].src=eval("pic_off.src");
		re = imgName;
		document[imgName].src=eval("pic_on.src");
	}
}
</script>

<a href="#" onMouseover="rollIn('button_1_')" onMouseout="rollOut('button_1_')" onClick="acti('pic1_')"><img src="images/link1a.gif" border=0 name="button_1_" alt="Imageswap" width=78 height=25><img src="images/linkb.gif" width=50 height=25 border=0 name="pic1_"></a><br>
<a href="#" onMouseover="rollIn('button_2_')" onMouseout="rollOut('button_2_')" onClick="acti('pic2_')"><img src="images/link2a.gif" border=0 name="button_2_" alt="Imageswap" width=78 height=25><img src="images/linkb.gif" width=50 height=25 border=0 name="pic2_"></a><br>

Kommentar

Scriptet växlar en utseende på en länkad bild, men det byter även ytterligare en bild när man klickar på länken. Detta gör scriptet användbart om man använder frames och vill tala om vilken av sidorna man tittar på just då. Vilka bilder som skall användas för varje länk definieras i början av scriptet.

,