document.all[''].style.display Mozilla incompatability

[MattOwens]

Hi,

I have a DHTML menu on a page which uses:

document.all['mnuProducts'].style.display='';

to display the menu on mouseover an image.

This does not work with Mozilla firebird, I have tried:

document.getElementById 'mnuProducts'].style
.visibility='visible';

which does not work either.

Does anyone know a work around for this. Is there a way of coding that works for both IE and Mozilla, without using an if browser switch?
Thanks
Matt

 

[theboyhope]

That should be document.getElementById( "mnuProducts" )

HTH.

 

[MattOwens]

Hi,

I've tried the following function (as the menu being shown needs to be decided at run time, and this doesn't work as well. Can you suggest anything else to try?

function ShowMenu(mnu){
document.getElementById(mnu).style.visibility='visible';
}

Thanks
Matt

 

[cLFlaVA]

To elaborate further on theboyhope's response:

The all[] collection is native only to Internet Explorer. A year ago we would have told you to use the layers[] collection, which was native only to NutScrape style browsers, but now the best way to go, if possible, is the getElementById() function.

*cLFlaVA
----------------------------
Lois: "Peter, you're drunk!"
Peter: "I'm not drunk, I'm just exhausted from stayin' up all night drinking!

 

[theboyhope]

What is the variable 'mnu' that you're passing to the function? What's the error message?

 

[MattOwens]

The mnu variable is the id of the div I wish to become visible.

So a call would be
ShowMenu('mnuProducts');

There is no error message given, just that the div does not appear.

Thanks Matt

 

[theboyhope]

That should work fine. In fact I just tested it and it does.

Try the below example and see if it works for you. Are you sure you shouldn't be setting style.display='block' btw?

<script type="text/javascript">

function ShowMenu(mnu) {
    
	document.getElementById(mnu).style.visibility = 'visible';
}

</script>

<div id="test" style="width: 100px; height: 100px; border: 1px solid #444; visibility: hidden;"></div>

<a onclick="ShowMenu( 'test' );">show it!!!</a>