Jojoxx.net

 

 

AnvändareAnvändare
Besökare just nu: 93
SnabblänkarSnabblänkar
JavaScript-arkivet
Perl
FAQ
Sök på Jojoxx.netSö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.

,