сейчас на сайте:
Лучшие сказки мира
Детектив и фантастика
Песни прошлых лет
Для досуга
смотреть оглавлениепримерразмер кода
The image is changed on mouseover, mouseout, and onclick, the onclick image remains until another link is clicked
This example uses three images for all the links, one for each event.
To create your image link the img tag is nested within a link
<a href="page.htm"> <img src="out.gif" name="img1" onmouseover="mOver(this)" onmouseout="mOut(this)" onclick="mActive(this)"> </a>
<script type="text/javascript"> <!-- var images = new Array("out.gif","over.gif","on.gif") // list images to preload var preloadImages=new Array() // preloads images for (i=0;i<images.length;i++) { preloadImages[i]=new Image() preloadImages[i].src=images[i] } lastN = "" function mOver(obj){ if(lastN != obj.name){ document.images[obj.name].src = images[1] } } function mOut(obj){ if(lastN != obj.name){ document.images[obj.name].src = images[0] } } function mActive(obj){ document.images[obj.name].src = images[2] if (lastN != "" && lastN != obj.name){ document.images[lastN].src = images[0] } lastN = obj.name } // --> </script>
<a href="yourpage.htm"><img src="out.gif" name="img2" onmouseover="mOver(this)" onmouseout="mOut(this)" onclick="mActive(this)"></a>
To show a particular links onclick image when the page initially loads add the following function
function defaultLink(el){ document.images[el].src = images[2] lastN=el }
and include onload="defaultLink('name')" in the opening body tag, where name is the name of the image tag