please help with js for dhtml menu

Hi, I'm new in this forum, and I'm new to js as well. I've been making webpages for a long time, but never got into js. I'm trying to figure out how to make a dhtml popup menu. I found some script for toggling layer visibility on another forum, so I'm trying to get that to work now as the first step.

Here's the javascript:
menu.js (http://www.mumstudents.org/~blisefski/dhtml-menu/menu.js)

Here's the html page i'm using it on:
index.html (http://www.mumstudents.org/~blisefski/dhtml-menu/index.html)

Here's the css file for that page: stylesheet.css (http://www.mumstudents.org/~blisefski/dhtml-menu/stylesheet.css)
(you can ignore all of the css except the #layer1 at the bottom)

So here's the problem:
The showLayer function isn't working!

layer1 should become visible when you mousover the link "nav pop," but it doesn't.

I tried making layer1 visible to start with rather than hidden, and then when I moused over the link the layer would hide (so I guess the hideAll and hideLayer functions appear to be working), however the showLayer function does not.

I don't really know javascript so it's hard for me to troubleshoot this. It all looks right to me. Can anyone see why this isn't functioning like it should? Any help would be greatly appreciated.

Just a thought but have you tried removing the visibility: hidden line from the CSS and using the style="visibility: hidden" tag as part of the div tag (not exactly sure of the syntax off the top of my head :o)? As what it appears is that the JScript is trying to change a property that isn't set in the html code.

That may solve your problem.

I'll give that a try

nope, that didn't help. Any other ideas?

Yeah I see the problem (and i've actually tested this one) lol :D

Okay in you .js file you're using the hideLayer() function on two extra layers that don't exist, which are being called in the hideAll() function.

To solve the problem, either remove (comment out) the following two lines in the hideAll() function:
hideLayer('layer2');
hideLayer('layer3');

or add two other layers to your HTML source with id's layer2 and layer3.

That'll solve the problem

Oh, I never thought that would make a difference, Thank you! Shows how much I know about JS (nothing :rolleyes: ). I'll give it a try this afternoon and hopfully my problems are solved.

Works great now, thank you so much! Hopefully I can get through the rest of this project without any more setbacks.

Ok, one more question to keep me going.

I've got the showLayer and hideLayer working fine now. My question is, once I mouseover one of the links that shows a layer, I want that newly visible layer to stay visible as long as my mouse is over that new layer. It should only dissappear when the mouse is off of the activating link and the new layer. Right now it dissappears when I move the mouse off of the activating link (because of the hideAll function), regardless of my mouseover on the newly visible menu layer. Is there some way I can use my existing script to handle this by telling it to showLayer('layer#') when my mouse is over that layer?
This script that I'm using is suppossed to be for dhtml menus so you'de think it would be neccessary to include this function but apparently not.

you know what, nevermind. I made the layers nested and now it works automatically.