Dag,
Ik heb al een goed werkend tree menu. Het heeft 3 items, met ieder ongeveer 3 subitems. Bij een "ongebruikte" pagina is het menu volledig ingeklapt.
Maar om de navigatie te verbeteren wil ik dat op sommige pagina's een bepaald menuitem als is uitgeklapt bij een "ongebruikte" pagina. Ik heb wel een idee hoe ik dit kan doen met behulp van php maar de javascript kennis schiet hierbij tekort. Ik denk nu aan het volgende:
Bij de pagina's waar ik het menuitem uitgeklapt wil hebben, geef ik een variable een bepaalde waarde met php, bijv $submenu = 1; Bij de pagina's met die waarde moet dan het eerste menuitem uitgeklapt zijn. Ik heb alleen geen idee hoe ik dit moet implementeren in mijn javascript/css.
Dit is de html van m'n menu:
En mijn javascript:
[JS]
var persistmenu="yes" //"yes" or "no". Make sure each SPAN content contains an incrementing ID starting at 1 (id="sub1", id="sub2", etc)
var persisttype="sitewide" //enter "sitewide" for menu to persist across site, "local" for this page only
if (document.getElementById){
document.write('<style type="text/css">\n')
document.write('.submenu{display: none;}\n')
document.write('</style>\n')
}
function SwitchMenu(obj){
if(document.getElementById){
var el = document.getElementById(obj);
var ar = document.getElementById("masterdiv").getElementsByTagName("span");
if(el.style.display != "block"){
for (var i=0; i<ar.length; i++){
if (ar.className=="submenu")
ar.style.display = "none";
}
el.style.display = "block";
}else{
el.style.display = "none";
}
}
}
[/JS]
Ik hoop erg dat iemand me hiermee kan helpen want ik heb geen idee hoe ik dit in mijn javascript moet zetten...
Ik heb al een goed werkend tree menu. Het heeft 3 items, met ieder ongeveer 3 subitems. Bij een "ongebruikte" pagina is het menu volledig ingeklapt.
Maar om de navigatie te verbeteren wil ik dat op sommige pagina's een bepaald menuitem als is uitgeklapt bij een "ongebruikte" pagina. Ik heb wel een idee hoe ik dit kan doen met behulp van php maar de javascript kennis schiet hierbij tekort. Ik denk nu aan het volgende:
Bij de pagina's waar ik het menuitem uitgeklapt wil hebben, geef ik een variable een bepaalde waarde met php, bijv $submenu = 1; Bij de pagina's met die waarde moet dan het eerste menuitem uitgeklapt zijn. Ik heb alleen geen idee hoe ik dit moet implementeren in mijn javascript/css.
Dit is de html van m'n menu:
HTML:
<div id="masterdiv">
<div class="menutitle" onclick="SwitchMenu('sub1')"><b> LKmachines</b></div>
<span class="submenu" id="sub1">
<a class="submenuitem" href="http://www.lkmachines.com/Lego%20Gun%20List.php"> Guns</a>
<a class="submenuitem" href="http://www.lkmachines.com/cars.php"> Vehicles</a>
<a class="submenuitem" href="http://www.lkmachines.com/lego-knex-machines-lk.php"> Machines</a>
</span>
<div class="menutitle" onclick="SwitchMenu('sub2')"><b> UserCreated</b></div>
<span class="submenu" id="sub2">
<a class="submenuitem" href="http://www.lkmachines.com/lego-knex-guns-uc.php"> Guns</a>
<a class="submenuitem" href="http://www.lkmachines.com/lego-knex-vehicles-uc.php"> Vehicles</a>
<a class="submenuitem" href="http://www.lkmachines.com/lego-knex-machines-uc.php"> Machines</a>
</span>
<div class="menutitle" onclick="SwitchMenu('sub3')"><b> Instructions</b></div>
<span class="submenu" id="sub3">
<a class="submenuitem" href="http://www.lkmachines.com/Lego%20Instructions.php"> LKmachines</a>
<a class="submenuitem" href="http://www.lkmachines.com/user-createdlego-knexinstructions.php"> UserCreated</a>
</span>
</div>
En mijn javascript:
[JS]
var persistmenu="yes" //"yes" or "no". Make sure each SPAN content contains an incrementing ID starting at 1 (id="sub1", id="sub2", etc)
var persisttype="sitewide" //enter "sitewide" for menu to persist across site, "local" for this page only
if (document.getElementById){
document.write('<style type="text/css">\n')
document.write('.submenu{display: none;}\n')
document.write('</style>\n')
}
function SwitchMenu(obj){
if(document.getElementById){
var el = document.getElementById(obj);
var ar = document.getElementById("masterdiv").getElementsByTagName("span");
if(el.style.display != "block"){
for (var i=0; i<ar.length; i++){
if (ar.className=="submenu")
ar.style.display = "none";
}
el.style.display = "block";
}else{
el.style.display = "none";
}
}
}
[/JS]
Ik hoop erg dat iemand me hiermee kan helpen want ik heb geen idee hoe ik dit in mijn javascript moet zetten...