Simple Javascript Problem? I hope so...

by WillR
8 replies
Warriors,

Hoping someone out there can help me with this.

I have a menu on a site that has a special sub-menu that works when someone clicks on the link.

So basically it is a link that when clicked on, drops down 3 other sub-menu options. These options are hidden until the link is clicked and if the link is clicked again, those sub-menu options will disappear.

The code is the following:

Code:
<html>
<head></head>
<body>

<ul class="nav">
<li class="icons"><a href="javascript:hideshow(document.getElementById('sub-menu'))">Menus</a></li>
<div id="sub-menu" style="display:none">    
<li class="menu"><a href="breakfast.php"><span>Breakfast</span></a></li>
<li class="menu"><a href="lunch.php"><span>Lunch</span></a></li>
<li class="menu"><a href="dinner.php"><span>Dinner</span></a></li>
</div>
</ul>

<script type="text/javascript">
function hideshow(which){
if (!document.getElementById)
return
if (which.style.display=="block")
which.style.display="none"
else
which.style.display="block"
}
</script>

</body>
</html>
This works great BUT my only problem is that I have tested it in a browser with no javascript enabled and obviously the feature does not work and the sub-menu options do not show. This is not ideal. The best outcome would be if no javascript is enabled in the browser, those 3 sub-menu items still display by default.

Does anyone know how to achieve that with this code?

Thanks in advance.
#javascript #problem #simple

Trending Topics