Link to home
Start Free TrialLog in
Avatar of nericksx
nericksx

asked on

Javascript to swap layer visability onClick

I'm creating a layout with "tabbed pages" where clicking one "tab" shows that layer but hides the currently visable one.  I can't figure out how to handle both functions with the one even handler.  Does anyone have a simple sample script for this that will work in IE and NS?  If it is W3C I would think it would work in both, right?
Avatar of GwynforWeb
GwynforWeb
Flag of Canada image

<script>
function toggle(obj){
if (obj.style.zIndex==1){
 temp=document.getElementById('d2').style.zIndex
document.getElementById('d2').style.zIndex=document.getElementById('d1').style.zIndex
 document.getElementById('d1').style.zIndex=temp
  }
}
</script>

<body>
<div id="d1"
style="position:absolute;top:100;left:100;height:200;width:200;background-color=yellow;z-index:1"
 onclick="toggle(this)"></div>

<div id="d2"
style="position:absolute;top:130;left:130;height:200;width:200;background-color=aqua;z-index:2"
  onclick="toggle(this)">
</div>
</body>
SOLUTION
Avatar of GwynforWeb
GwynforWeb
Flag of Canada image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
background-color=red  should read  background-color:red  same for the other colors   else it will not run in NS
Avatar of nericksx
nericksx

ASKER

Cool, but I don't want to swap their z-index because you'll still be able to see the layers underneath.  I need to swap the visabilty (visable, hidden).  I'm not sure how I would swap in the syntax for visability in the code above.  (I like how short it is, tho!)
SOLUTION
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
ASKER CERTIFIED SOLUTION
Avatar of devic
devic
Flag of Germany image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Ok, I totally cheated and used the built in behaviors in Dreamweaver.  I'm totally ashamed but it was pretty slick.  Thanks to everyone who responded, points for everyone for going to the effort (esp Gwyn who did write a very elegant script).