Javascript navigation problems

[mikka23]

Well I have been trying to get this navigation for a while. Its a two level horizontal navigation. I have two problems which I can see:

1. When you hover over a link the sub links stay up when you hover over another main link so they have multiple links overlapping.

2. I wanted to display the currect pages sub links as default then they are replace by the hovered over sublinks. Eg. If you are on the excercise page then treadmills, bands links are shown when you aren't hovering over any links. Then when you hover over a link such as clothing the sublinks change to basketball, football for clothing.

You can see my coding so far: http://www.fuvz.com/sporting/index.html

[MikeHopley]

The more fundamental problem is that your navigation fails completely when javascript is off.

Validate your HTML. Your id's must begin with a letter, not a number.

You need to set "display: none" onmouseout, or make each link's onmouseover set this for all other links. At the moment, the only way to clear a menu is to hover over the link a second time!

[mikka23]

Yeah that was another problem I have. I also hear you could do this navigation type purely using CSS. That would be better. I have been searching around but still can't work it out though.

Anyone be able to help. I really need this part done so I can get on with the rest .

[Marc]

Have a look at this thread: http://www.webforumz.com/new-to-web-...htm#post274814. It has alot of good links.

[mikka23]

I have changed to a purely css navigation. Only two problems which I have and cannot fix.

1. Main Links only the top is a link. If you hover over bottom nothing happens.

2. Sub links are higher than active. When padding is changed is puts backgrounds out.

Coding: http://www.fuvz.com/sporting/index2.html

[Marc]

1. They are all links for me...
2. Does it work with Margin? Sometimes it does.

[mikka23]

They are all links but the area for the link is too small in FF anyways. If you hover over below middle on the top links it would select.

[Marc]

It looks fine for me

[mikka23]

What browser? If I hover over bottom half of top level links they dont highlight the link. In both IE6 and FF it seems to do that. I managed to sort sub link background out in firefox but its off in IE6 now.

This nav is killing me