|
Note that the script goes in the HEAD
of the document and reference tags go in the body.
<Html>
<Head>
<title>Triggering rollovers from a link</title>
<script language=javascript>
<!-- Hide script from old browser
if (document.images)
{ imageOff=new Image (width,height);
imageOff.src="your-image.gif";
imageOn1=new Image (width,height);
imageOn1.src="your-second-image.gif";}
function swapImage(imgName)
{
if (document.images) {
eval (' document.changingImage.src=' + imgName + ' .src ');}
} function swapImageBack() {
if (document.images) document.changingImage.src=imageOff.src;}
}
// end hiding script from old
browsers -->
</script>
<Body bgcolor=white>
<!--
this is the link that will trigger the effect // -->
<p align="center"><small><a
href="http://www.your-link.com"
onMouseOver="swapImage( ' imageOn1'
);"
onMouseOut="swapImageBack();"><font
face="Arial">Move
the mouse over this link</font></a>
<!--
this is the location of the reference image for the script // -->
</p>
<p align="center"><img
src="your-image.gif"
name="changingImage"
border="0"
hspace="0"
vspace="0"
width="0"
height="0">
</body>
</html>
Click here
to see what it looks like
|