JavaScript Mouse Click - Different Image Stays

When you click on the link it will stay highlighted. When you click on another link, that link will become highlighted and the other will turn off!

Script Demo:

Demo

JavaScript Code:

Insert this code into <head> tags

<script language="JavaScript">
<!-- Hide from old browsers


var NN3 = false;
image1 = new Image();
image1.src = "IMAGE FILE OFF";
image1on = new Image();
image1on.src = "IMAGE FILE ON";
image2 = new Image();
image2.src = "IMAGE FILE OFF";
image2on = new Image();
image2on.src = "IMAGE FILE ON";


function on3(name)   {
        document[name].src = eval(name + "on.src");
}

function clearimg(){
    document.image1.src = image1.src
    document.image2.src = image2.src
}

NN3 = true;

function on(name)  {
        if (NN3) on3(name);
}
// -->
</script>

Insert this code into <body> tags

<a href="YOUR LINK HERE" onmousedown="clearimg();" onmouseup="on('image1');"><img src="IMAGE FILE OFF"  border="0" name="image1"></a><br>
<a href="YOUR LINK HERE" onmousedown="clearimg();" onmouseup="on('image2');"><img src="IMAGE FILE OFF"  border="0" name="image2"></a><br>

Instruction:

Change the following text:

Add as many image as you like with change all the "image1, image2, image3, image456789...".
IMAGE FILE OFF - Normal image file URL.
IMAGE FILE ON - Mouse over image file URL.
YOUR LINK - Website URL where you want to link to when click on image.

Webmaster » Web Programming » JavaScript » Mouse Over Script » Click - Different Image Stays

Related Links:

Home | Sitemap | Bookmark This Page

Sponsored Links

Recommended Links