|
Subject:
|
Array driven menu
|
|
Posted By:
|
fs22
|
Post Date:
|
2/14/2006 9:18:17 PM
|
Greetings~
I have built an array driven menu system. I just wanted to show how I did it and get any feedback on better practices...more elegant code. Lemme know your thoughts. Here is the code...
Normal array...yada...yada...yada
var MyTrainingMenuItems = new Array();
MyTrainingMenuItems[0] = new Array();
MyTrainingMenuItems[0][0] = "Current";
MyTrainingMenuItems[0][1] = "somewhere.htm";
MyTrainingMenuItems[0][2] = "Current Registrations";
<div id="menu">
<ul><li><a href="#"onclick="javascript:showmenu('smenu1');">My Training</a></li></ul>
<div id="smenu1">
<script language="javascript">
var loopCounter;
for (loopCounter = 0; loopCounter < MyTrainingMenuItems.length; loopCounter++)
{
document.write("<li><a href='" + MyTrainingMenuItems[loopCounter][1] + "'>" + MyTrainingMenuItems[loopCounter][2] + "</a></li>");
}
</script>
</div>
<ul><li><a href="#" onclick="javascript:showmenu('smenu2');">Application Training</a></li></ul>
<div id="smenu2">
<script language="javascript">
var loopCounter;
for (loopCounter = 0; loopCounter < ApplicationTrainingItems.length; loopCounter++)
{
document.write("<li><a href='" + ApplicationTrainingItems[loopCounter][1] + "'>" + ApplicationTrainingItems[loopCounter][2] + "</a></li>");
}
</script>
</div>
<ul><li><a href="#" onclick="javascript:showmenu('smenu3');">Recommended Path</a></li></ul>
<div id="smenu3">
<script language="javascript">
var loopCounter;
for (loopCounter = 0; loopCounter < RecommendedTrainingPathsItems.length; loopCounter++)
{
document.write("<li><a href='" + RecommendedTrainingPathsItems[loopCounter][1] + "'>" + RecommendedTrainingPathsItems[loopCounter][2] + "</a></li>");
}
</script>
The above is the actual menu and this is the showmenu function..
window.onload=showmenu;
function showmenu(id) {
var d = document.getElementById(id);
for (var i = 1; i<=10; i++) {
if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
}
if (d) {d.style.display='block';}
}
Let me know if you guys have any better ideas. I played around with css driven menus and differing types of js menus.
Clay Hess
|
|
