JavaScript onmouseover

ilj@flowsim.se
JavaScript onmouseover
example: move the mouse pointer over the text
code and explanations follows below
>>> this example in Swedish

1
Preload the images. Put the JavaScript code somewhere between the HEAD tags.

if(document.images)
{
bild=new Array()
bild[0]=new Image()
bild[1]=new Image()
//more images? just continue the preloading: bild[2], bild[3] etc
bild[0].src="MOUSEOUTBILD"
bild[1].src="MOUSEOVERBILD"
}

Replace MOUSEOUTBILD and MOUSEOVERBILD by the names of your image files, e.g. yourpicture.gif:

bild[0].src="yourpicture1.gif"
bild[1].src="yourpicture2.gif"

2
Put en IMG tag on the page and name it (after ID). In this example the img tag is named place1.

<A HREF="URL"
ONMOUSEOVER=
"if(document.images && document.geElementById) {document.getElementById('place1').src=bild[1].src}"
ONMOUSEOUT=
"if(document.images && document.geElementById) {document.getElementById('place1').src=bild[0].src}">
<IMG SRC ="enbild.gif"
   BORDER ="0"
   ALT =""
   ID ="place1"></A>

When a ONMOUSEOVER occurs the image preloaded after bild[1].src will be shown.

OTHER JAVASCRiPT EXAMPLES