Have I done these rollovers correctly?

[Lorne Cameron]

I've put together a rough copy of what will be my site's menu bar, but
I'm not sure if I've done the rollovers correctly (I got the code from
HTMLcodetutoria l.com I think). Check the look and code out here -
http://www.sportsunion.strath.ac.uk/...est/index.html

When I roll my mouse over an image, it changes as expected, but in
Mozilla, when I take the mouse away, there is a slight delay before the
image reverts to its original state, which I haven't experienced
elsewhere (looks great in IE though, which 90% of my site's visitors
will be running, no doubt).

Thanks in advance for any input.
LC.

[Evertjan.]

Lorne Cameron wrote on 10 aug 2003 in comp.lang.javas cript:

I've put together a rough copy of what will be my site's menu bar, but
I'm not sure if I've done the rollovers correctly (I got the code from
HTMLcodetutoria l.com I think). Check the look and code out here -
http://www.sportsunion.strath.ac.uk/...est/index.html
your code:

<A HREF="" ONMOUSEOVER="im age1.src='1_ove r.gif';"
ONMOUSEOUT="ima ge1.src='1.gif' ;"><IMG NAME="image1" SRC="1.gif"
BORDER="0">

=============== =
The over/out codes are better off in the img declaration
and then can be shorter using "this":

<A HREF="">
<IMG SRC="1.gif" BORDER="0"
ONMOUSEOVER="th is.src='1_over. gif';"
ONMOUSEOUT="thi s.src='1.gif';"</A>
=============== =
you could also use the preloaded var name:

<A HREF="">
<IMG SRC="1.gif" BORDER="0"
ONMOUSEOVER="th is.src=image1.s rc;"
ONMOUSEOUT="thi s.src='1.gif';"</A>
=============== =
or use functions:

<script>
function imgover(x){
x.save=x.src
x.src=x.id.subs tr(3)+"_over.gi f"
}
function imgout(x){
x.src=x.save
}
</script>

<A HREF="">
<IMG SRC="1.gif" BORDER="0" id="gif1"
ONMOUSEOVER="im gover(this)"
ONMOUSEOUT="img out(this)"</A>

not tested
--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[Evertjan.]

Lorne Cameron wrote on 10 aug 2003 in comp.lang.javas cript:

I've put together a rough copy of what will be my site's menu bar, but
I'm not sure if I've done the rollovers correctly (I got the code from
HTMLcodetutoria l.com I think). Check the look and code out here -
http://www.sportsunion.strath.ac.uk/...est/index.html
your code:

<A HREF="" ONMOUSEOVER="im age1.src='1_ove r.gif';"
ONMOUSEOUT="ima ge1.src='1.gif' ;"><IMG NAME="image1" SRC="1.gif"
BORDER="0">

=============== =
The over/out codes are better off in the img declaration
and then can be shorter using "this":

<A HREF="">
<IMG SRC="1.gif" BORDER="0"
ONMOUSEOVER="th is.src='1_over. gif';"
ONMOUSEOUT="thi s.src='1.gif';"</A>
=============== =
you could also use the preloaded var name:

<A HREF="">
<IMG SRC="1.gif" BORDER="0"
ONMOUSEOVER="th is.src=image1.s rc;"
ONMOUSEOUT="thi s.src='1.gif';"</A>
=============== =
or use functions:

<script>
function imgover(x){
x.save=x.src
x.src=x.id.subs tr(3)+"_over.gi f"
}
function imgout(x){
x.src=x.save
}
</script>

<A HREF="">
<IMG SRC="1.gif" BORDER="0" id="gif1"
ONMOUSEOVER="im gover(this)"
ONMOUSEOUT="img out(this)"</A>

not tested
--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)