Code Library - js
Hide Show Layers - (1756 views)
<SCRIPT TYPE="text/javascript">
// detect browser
NS4 = (document.layers) ? 1 : 0;
IE4 = (document.all) ? 1 : 0;
// W3C stands for the W3C standard
W3C = (document.getElementById) ? 1 : 0;
function makeVisible ( name ) {
var ele;
if ( W3C ) {
ele = document.getElementById(name);
} else if ( NS4 ) {
ele = document.layers[name];
} else { // IE4
ele = document.all[name];
}
if ( NS4 ) {
ele.visibility = "show";
} else { // IE4 & W3C & Mozilla
ele.style.visibility = "visible";
ele.style.display = "inline";
}
}
function makeInvisible ( name ) {
if (W3C) {
document.getElementById(name).style.visibility = "hidden";
document.getElementById(name).style.display = "none";
} else if (NS4) {
document.layers[name].visibility = "hide";
} else {
document.all[name].style.visibility = "hidden";
document.all[name].style.style.display = "none";
}
}
</SCRIPT>
<DIV ID="redblock" STYLE="display:none">
<table width=200><tr><td bgcolor=990000> </td></tr></table>
</DIV>
<br/><br/>
<DIV ID="blueblock" STYLE="display:none">
<table width=200><tr><td bgcolor=000099> </td></tr></table>
</DIV>
<br/><br/>
Show: <a href=javascript:makeVisible('blueblock')>blueblock</a> <a href=javascript:makeVisible('redblock')>redblock</a>
Hide: <a href=javascript:makeInvisible('blueblock')>blueblock</a> <a href=javascript:makeInvisible('redblock')>redblock</a>
