richsmith
Oct 17th, 2004, 08:45 AM
Ok, im building a menu, and i want to so that if i click a button parts of the menu appear or disapear and when i click the same button it either disapears or appears dependin on the state it is in. i have this code below but cant make it so that it can appear after disapearing on the same button, please help
<!-- menu -->
<script type="text/javascript">
<!--
HM_DOM = document.getElementById ? true : false;
HM_IE = document.all ? true : false;
HM_NS4 = document.layers ? true : false;
function HM_f_ToggleElementList(show,elList,toggleBy) {
if(!(HM_DOM||HM_IE||HM_NS4)) return true;
if(HM_NS4&&(toggleBy=="tag")) return true;
for(var i=0; i<elList.length; i++) {
var ElementsToToggle = [];
switch(toggleBy) {
case "tag":
ElementsToToggle =
(HM_DOM) ? document.getElementsByTagName(elList[i]) :
document.all.tags(elList[i]);
break;
case "id":
ElementsToToggle[0] =
(HM_DOM) ? document.getElementById(elList[i]) :
(HM_IE) ? document.all(elList[i]) :
document.layers[elList[i]];
break;
}
for(var j=0; j<ElementsToToggle.length; j++) {
var theElement = ElementsToToggle[j];
if(!theElement) continue;
if(HM_DOM||HM_IE) {
theElement.style.visibility =
show ? "inherit" : "hidden";
} else {
theElement.visibility =
show ? "inherit" : "hide";
}
}
}
return true;
}
// -->
</script>
<font face="arial">
<link rel="Stylesheet" href="CSS/menu.css" type="text/css">
<table bordercolor="white" align="left" border="1" cellspacing="0" cellpadding="0" width="16%">
<tr bgcolor="red">
<td><center>
<a href="#" onclick="HM_f_ToggleElementList(false,['td1', 'td2', 'td3', 'td4', 'td5', 'td6', 'td7', 'td8', 'td9', 'td10'],'id'); return false">
<img src="images/leftml.gif" border="0" align="left" vspace="5">
Menu </center></a>
</td>
</tr>
thanks
<!-- menu -->
<script type="text/javascript">
<!--
HM_DOM = document.getElementById ? true : false;
HM_IE = document.all ? true : false;
HM_NS4 = document.layers ? true : false;
function HM_f_ToggleElementList(show,elList,toggleBy) {
if(!(HM_DOM||HM_IE||HM_NS4)) return true;
if(HM_NS4&&(toggleBy=="tag")) return true;
for(var i=0; i<elList.length; i++) {
var ElementsToToggle = [];
switch(toggleBy) {
case "tag":
ElementsToToggle =
(HM_DOM) ? document.getElementsByTagName(elList[i]) :
document.all.tags(elList[i]);
break;
case "id":
ElementsToToggle[0] =
(HM_DOM) ? document.getElementById(elList[i]) :
(HM_IE) ? document.all(elList[i]) :
document.layers[elList[i]];
break;
}
for(var j=0; j<ElementsToToggle.length; j++) {
var theElement = ElementsToToggle[j];
if(!theElement) continue;
if(HM_DOM||HM_IE) {
theElement.style.visibility =
show ? "inherit" : "hidden";
} else {
theElement.visibility =
show ? "inherit" : "hide";
}
}
}
return true;
}
// -->
</script>
<font face="arial">
<link rel="Stylesheet" href="CSS/menu.css" type="text/css">
<table bordercolor="white" align="left" border="1" cellspacing="0" cellpadding="0" width="16%">
<tr bgcolor="red">
<td><center>
<a href="#" onclick="HM_f_ToggleElementList(false,['td1', 'td2', 'td3', 'td4', 'td5', 'td6', 'td7', 'td8', 'td9', 'td10'],'id'); return false">
<img src="images/leftml.gif" border="0" align="left" vspace="5">
Menu </center></a>
</td>
</tr>
thanks