Rollovers only work in IE, but not in other browsers

[craigsy]

Hello everybody,

Im new to this forum, and would appreciate some help.
I have created a javascript rollover in dreamweaver, which swaps the default home image, to a more relevant image, when you hover over a flash button. The image rollowver works perfectly in IE6, but in Mozilla and Netscape, the image only rolls over when the mouse hovers on the very last line of pixels at the bottom of the flash button. Obviously the not only looks rubbish, but it is confusing to the user as the images appear to be swapping randomly. Can any body shed some light on this? Heres the code

</p>
<p>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="100" height="35" onMouseOver="MM_swapImage('blank','','Art/homeservice.jpg',1)" onMouseOut="MM_swapImgRestore()">
<param name="BGCOLOR" value="#666666">
<param name="movie" value="support.swf">
<param name="quality" value="high">
<embed src="support.swf" width="100" height="35" quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" bgcolor="#666666" ></embed>
</object>

thanks

Craig

[lZakl]

craigsy,

I have an idea for you to try. I am sorry, I would usually test the idea I have to offer and give you a working script (but today I am kind of busy). So heres my idea.

Your Javascript:

function menu1() 
{
 document.getElementById("inside").innerHTML = "<img src=blah.gif>";
}
function unmenu() 
{
 document.getElementById("inside").innerHTML = "
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="100" height="35" onMouseOver="MM_swapImage('blank','','Art/homeservice.jpg',1)" onMouseOut="MM_swapImgRestore()">
<param name="BGCOLOR" value="#666666">
<param name="movie" value="support.swf">
<param name="quality" value="high">
<embed src="support.swf" width="100" height="35" quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" bgcolor="#666666" ></embed>
</object>";
}

(All with single quotes obviously)

Then in you HTML, use a DIV with an <a> tag around it. Like this

<a onMouseover="menu1()" OnMouseOut="unmenu()">
<DIV id="inside">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="100" height="35" onMouseOver="MM_swapImage('blank','','Art/homeservice.jpg',1)" onMouseOut="MM_swapImgRestore()">
<param name="BGCOLOR" value="#666666">
<param name="movie" value="support.swf">
<param name="quality" value="high">
<embed src="support.swf" width="100" height="35" quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" bgcolor="#666666" ></embed>
</object>";
</DIV>
</a>

I did not test this, and am not sure if it would even work an <a> tag around the DIV, but it's an idea..

Anyone know off hand if this will work for craigsy?

Good Luck!

-- Zak

[craigsy]

Zak

first off, thanks a lot for your help, it is much appreciated!

I tried your solution, but it produced a strange result. the following characters are now displayed next to the Flash button "; and if I hover in the single character space between the button and the " then the image will rollover, however if I move out of this single space then the rollover defaults back to the original image. Hovrering the pointer over the flash button still produces no rollover.
Im encouraged that the rollover is possible, and if you could shed any light on why this is happenening, it would be greatly appreciated.

Thanks

Craig