DHTML drop down menu - Cross Browser

[Gregg Bolinger]

I am needing some cross browser code help. I am working on a DHTML drop down menu. You can view it at http://gregg.embeddedthought.com/gthought/index.php.
In IE it works great. In Mozilla, it doesn't work at all and I don't know what I am doing that is not Netscape/Mozilla compatible.
Here is some sample code, or you can just do View Source on the link above.

<font size="2">
<div
id="MenuA" 
class="commonMenuStyle" 
style="POSITION: absolute; z-index: 3; visibility: visible; left: 280px; top: 28px;" 
onmouseover="document.all.Item1.style.visibility='visible';this.style.curser='hand'"
onmouseout="document.all.Item1.style.visibility='hidden'"> <B>About</B> </div>
<div 
id="Item1" 
style="WIDTH: 80px; COLOR: white; FONT-FAMILY: Verdana; POSITION: absolute; TOP:44px;
LEFT200px; BACKGROUND-COLOR: #003366; TEXT-ALIGN: center; left: 280px; visibility: hidden; z-index: 100;"
onmouseover="this.style.visibility='visible'; this.style.cursor='hand'"
onmouseout="this.style.visibility='hidden'">

<div 
class="menuItemsAllBorder" 
style="FONT-SIZE: 8pt;COLOR: white;BACKGROUND-COLOR: #003366" 
onmouseover="this.style.backgroundColor='#3F5971'" 
onmouseout="this.style.backgroundColor='#003366'"
onclick="location='<I>url</I>'">
This Site
</div>
<div 
class="menuItemsBottomBorder" style="FONT-SIZE: 8pt;COLOR: white;BACKGROUND-COLOR: #003366"
onmouseover="this.style.backgroundColor='#3F5971'" 
onmouseout="this.style.backgroundColor='#003366'"
onclick="location='<I>url</I>'">
Owner
</div>
<div 
class="menuItemsBottomBorder" style="FONT-SIZE: 8pt;COLOR: white;BACKGROUND-COLOR: #003366"
onmouseover="this.style.backgroundColor='#3F5971'" 
onmouseout="this.style.backgroundColor='#003366'"
onclick="location='<I>url</I>'">
Contact
</div>
</div>
</font>

Thanks for any help.
[ September 11, 2003: Message edited by: Eric Pascarello ]

[Gregg Bolinger]

I have tried document.getElementById but either I am doing it wrong, or it is not working. It even throws an error in IE.
It says that the element I am getting is null or not an object.

[Eric Pascarello]

document.all is only ie
change document.all to document.getElementById
you might want to look at this script
http://www10.brinkster.com/a1ien51/JavaRanch/showhidetoggle.htm
or this one
http://www10.brinkster.com/a1ien51/JavaRanch/innerhtmltext.htm
or this one
http://www10.brinkster.com/A1ien51/basics/innerhtmlcompat.htm
Eric

[Gregg Bolinger]

Between my last post and your post, I figured it out. I had to use () and put the element id in ' '.
Thanks Eric.

[Gregg Bolinger]

BTW - how do those menus look? Lame or alright?

[Gregg Bolinger]

Ok, more problems. But these are appearntly css problems. The background image is not showing up on the Menu. And the Borders around the Menu items are not showing up. If you look at the difference between the IE version and the Mozilla version, you will see what I mean. Here is my CSS and what not.

.commonMenuStyle 
{ 
FONT-SIZE: 10pt; 
BACKGROUND-IMAGE: url(../images/navbackground.png); 
WIDTH: 80px; 
COLOR: white; 
FONT-FAMILY: Verdana; 
TEXT-ALIGN: left; 
TEXT-DECORATION: none 
}

I am going to guess that it might be with the url(...) part, but I don't know what else to use there.

.menuItemsAllBorder 
{ 
BORDER-RIGHT: #000000 1px solid; 
BORDER-TOP: #000000 1px solid; 
BORDER-BOTTOM: #000000 1px solid; 
BORDER-LEFT: #000000 1px solid; 
}

Not sure why that isn't working.
Thanks.

[Eric Pascarello]

It does not look bad, but the one thing that people might find a pain is when they move off of it, it closes right away. I have a made a menu in the past. I forgot about it until I was looking through my site for a file tonight.
http://www10.brinkster.com/a1ien51/Menus/A1ien51MenuV1.htm
I have no idea how it was coded, since I do not remember doing it, or what browsers it works in.
Eric

[Eric Pascarello]

I am not 100% positive but is it the .png file? Try to use a bmp just for a quick test....I just have a weird feeling,,,or it might be my bed calling!
Eric

[Gregg Bolinger]

Still a no go. I will worry about it tomorrow. The bed IS calling me. Thanks for the help.

[Scott Christy]

In case you're interested, below is a link to a DHTML menu that works great on any platform. I've used it on the site I run for my school and it works great. You might want to check it out.
http://www.dynamicdrive.com/dynamicindex1/hvmenu/index.htm

[Gregg Bolinger]

Originally posted by Scott Christy:
In case you're interested, below is a link to a DHTML menu that works great on any platform. I've used it on the site I run for my school and it works great. You might want to check it out.
http://www.dynamicdrive.com/dynamicindex1/hvmenu/index.htm

Thanks for the link. Yeah, it's nice, but it's nothing exciting and it is really plain and dull (no offense intended).
That is why I am using images and CSS, to make mine a bit more pleasant to the eyes.