PDA

Click to See Complete Forum and Search --> : How can I make

raadsel
05-03-2003, 01:56 PM
Hi

How can I make a function show / hide layers react to a select menu
with an onChange event in the same document.
Is there a tutorial for this some where?
raadsel
05-11-2003, 09:27 AM
Hi Dave
Thanks for your suggestion, but it isn't working for me.
I have tried different ways.
The script I'm using :
ns4 = (document.layers) ? true:false
ie4 = (document.all) ? true:false
ng5 = (document.getElementById) ? true:false

function hideLayer() {
if (ng5) document.getElementById('la1').style.visibility = "hidden";
else if (ns4) document.la1.visibility = "hide";
else if (ie4) la1.style.visibility ="hidden";

if (ng5) document.getElementById('la2').style.visibility = "hidden";
else if (ns4) document.la2.visibility = "hide";
else if (ie4) la2.style.visibility ="hidden";

if (ng5) document.getElementById('la3').style.visibility = "hidden";
else if (ns4) document.la3.visibility = "hide";
else if (ie4) la3.style.visibility ="hidden";

if (ng5) document.getElementById('la4').style.visibility = "hidden";
else if (ns4) document.la4.visibility = "hide";
else if (ie4) la4.style.visibility ="hidden";
}

function showLayer(n) {
hideLayer();
if (ng5) document.getElementById('la' + n).style.visibility = "visible";
else if (ns4) document.layers["la" + n].visibility = "show";
else if (ie4) document.all["la" + n].style.visibility = "visible";
return true;
}
Is this the wrong script ? It works with a href="#"
onclick=showLayer(1).
Could you help me out please ?
Thanx
raadsel
raadsel
05-12-2003, 12:30 PM
Hi Dave

This means that the script above works with dummy links to show and hide layers.
Hopefully is this what you meant.

raadsel
Jona
05-12-2003, 12:37 PM
Can you post where all of your layers/divs are? Because with just the JavaScript code I can't get it to fully work, but here is what does work:

<select onChange="var sel = this.options[this.options.selectedIndex].index;
switch (sel){
case 0: showLayer(1); break;
case 1: showLayer(2); break;
case 2: showLayer(3); break;
default: break; }
return true;">
<option selected value="ha">Ha</option>
<option value="hoo">Hoo</option>
<option value="hee">HEE</option>
</select>
Jona
05-12-2003, 01:13 PM
<html><head><script>
ns4 = (document.layers) ? true:false
ie4 = (document.all) ? true:false
ng5 = (document.getElementById) ? true:false

function hideLayer(){
sel = document.f.s.options.length;
for(i=0;i<sel;i++){
if(ng5)
document.getElementById("la"+i).style.visibility="hidden";
else if(ns4) document.layers["la"+i].visibility="hide";
else if(ie4){
document.all["la"+i].style.visibility="hidden";}
} }

function showLayer(n){
if(ng5){document.getElementById("la"+n).style.visibility="visible";}
else if(ns4) document.layers["la"+n].visibility = "show";
else if(ie4) document.all["la"+n].style.visibility="visible";
}
</script></head><body>
<form name="f">
<select name="s" onChange="var sel = this.options[this.options.selectedIndex].index;
switch (sel){
case 0: hideLayer(); showLayer(0); break;
case 1: hideLayer(); showLayer(1); break;
case 2: hideLayer(); showLayer(2); break;
default: break; }
return true;">
<option selected value="ha">Ha</option>
<option value="hoo">Hoo</option>
<option value="hee">HEE</option>
</select></form>
<div id="la0" style="visibility:hidden">Haha</div><br>
<div id="la1" style="visibility:hidden">Hooohooo</div><br>
<div id="la2" style="visibility:hidden">Heeheee</div>
</body></html>
raadsel
05-13-2003, 01:39 PM
To Jona
Thanx
raadsel
Jona
05-13-2003, 01:41 PM
You're welcome. ;)