Changing menu image

[bzi999]

Hi!
I'm trying to create a javaxcript application that changes a image menu
by following the mouse, something like:

<!-- menu images are m1, m2, m3.gif-->
<script language="JavaScript">
function option1()
{ document.getElementById("menu").write("<img src=m1.gif>"); }
function option2()
{ document.getElementById("menu").write("<img src=m2.gif>"); }
....</script>

<div id="menu">
<OBJECT data="m1.gif" type="image/gif" usemap="#map1" border=0>
<MAP name="map1">
<AREA HREF="#/" COORDS="0,0,50,14" onMouseOver="Option1()">
<AREA HREF="#/" COORDS="50,0,100,14" onMouseOver="Option2()">
....
</MAP></OBJECT>
</div>

I think you get the idea...
This seems very easy to do but it's not, believe me.
Any ideas? Thanks in advance!

[Darren]

<bz****@gmail.com> wrote in message
news:11**********************@g47g2000cwa.googlegr oups.com...

Hi!
I'm trying to create a javaxcript application that changes a image menu
by following the mouse, something like:

<!-- menu images are m1, m2, m3.gif-->
<script language="JavaScript">
function option1()
{ document.getElementById("menu").write("<img src=m1.gif>"); }
function option2()
{ document.getElementById("menu").write("<img src=m2.gif>"); }
...</script>

<div id="menu">
<OBJECT data="m1.gif" type="image/gif" usemap="#map1" border=0>
<MAP name="map1">
<AREA HREF="#/" COORDS="0,0,50,14" onMouseOver="Option1()">
<AREA HREF="#/" COORDS="50,0,100,14" onMouseOver="Option2()">
...
</MAP></OBJECT>
</div>

I think you get the idea...
This seems very easy to do but it's not, believe me.
Any ideas? Thanks in advance!
Not sure what you're after exactly but at a guess i would think you need a
placeholder and change its href.

[Darren]

<bz****@gmail.com> wrote in message
news:11**********************@g47g2000cwa.googlegr oups.com...

Hi!
I'm trying to create a javaxcript application that changes a image menu
by following the mouse, something like:

<!-- menu images are m1, m2, m3.gif-->
<script language="JavaScript">
function option1()
{ document.getElementById("menu").write("<img src=m1.gif>"); }
function option2()
{ document.getElementById("menu").write("<img src=m2.gif>"); }
...</script>

<div id="menu">
<OBJECT data="m1.gif" type="image/gif" usemap="#map1" border=0>
<MAP name="map1">
<AREA HREF="#/" COORDS="0,0,50,14" onMouseOver="Option1()">
<AREA HREF="#/" COORDS="50,0,100,14" onMouseOver="Option2()">
...
</MAP></OBJECT>
</div>

I think you get the idea...
This seems very easy to do but it's not, believe me.
Any ideas? Thanks in advance!

This might help
http://forums.devshed.com/archive/t-120380

[ASM]

bz****@gmail.com wrote:

Hi!
I'm trying to create a javaxcript application that changes a image menu
by following the mouse, something like:

<!-- menu images are m1, m2, m3.gif-->
<script language="JavaScript">
function option1()
{ document.getElementById("menu").write("<img src=m1.gif>"); }
document.getElementById('menu').getElementsByTagNa me('OBJECT')[0].src='m1.gif';

but it is a bad idea as 'm1.gif' not yet downloaded on mouse over

about an alternative ?
change apparence of image by css preloading ?
http://perso.wanadoo.fr/stephane.mor..._etats_css.htm
http://perso.wanadoo.fr/stephane.mor..._etats_css.htm
with some words in french... but without them I think it's clear
<div id="menu">
<OBJECT data="m1.gif" type="image/gif" usemap="#map1" border=0>
<MAP name="map1">
<AREA HREF="#/" COORDS="0,0,50,14" onMouseOver="Option1()">
<AREA HREF="#/" COORDS="50,0,100,14" onMouseOver="Option2()">
...
</MAP></OBJECT>
</div>

--
Stephane Moriaux et son [moins] vieux Mac