Forum Moderators: open
So I made a function that sets the old layer to hidden and the newly selected layer to visible. I'm just not sure how to get the 'last_obj' variable to
A. Get into the function
B. Get out of the function so the function can use it next time a mouseover occurs.
Here is what I have now:
<script>
function unit_select(obj, last_obj) {
last_obj.style.visibility='hidden';
obj.style.visibility='visible';
last_obj = obj;
}
</script>
<html>
<a onMouseOver="unit_select(Layer1, last_obj);"></a>
</html>
This is still not working.
<script>
function unit_select(obj) {
obj.style.visibility='visible';
var temp = document.vars.last_obj.value;
temp.style.visibility='hidden';
document.vars.last_obj.value=obj;
}
</script>
<form name="vars">
<div id="Layer1" style="position:absolute; visibility:hidden; background: #FFFFFF; left:84px; top:37px; width:378px; height:133px; z-index:1">
abcdef
</div>
<div id="Layer2" style="position:absolute; visibility:hidden; background: #FFFFFF; left:84px; top:37px; width:378px; height:133px; z-index:1">
zxvyt
</div>
<div id="Layer3" style="position:absolute; visibility:hidden; background: #FFFFFF; left:84px; top:37px; width:378px; height:133px; z-index:1">
mjauo
</div>
<a onMouseOver="unit_select(Layer1);">1</a>
<a onMouseOver="unit_select(Layer2);">2</a>
<a onMouseOver="unit_select(Layer3);">3</a>
<input type="hidden" name="last_obj" value="Layer1">
</form>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html><head><title>TEST</title>
<style type="text/css">
.myLayer{
position:absolute; left:84px; top:37px;
width:378px; height:133px;visibility:hidden;
background: #FFFFFF; border: solid 1px #ADD8E6;
}
</style>
<script>
/*
Don't rely on ids as global variables to
reference elements. Use doc.getElementById
*/var myLayerCurr;
function unit_select(id)
{
if(myLayerCurr)
myLayerCurr.style.visibility='hidden';
myLayerCurr = document.getElementById(id);
myLayerCurr.style.visibility='visible';
}
</script>
</head>
<body><div id="layer1" class="myLayer">abcdef</div>
<div id="layer2" class="myLayer">zxvyt</div>
<div id="layer3" class="myLayer">mjauo</div><a onmouseover="unit_select('layer1');" href="javascript:void()">1</a>
<a onmouseover="unit_select('layer2');" href="javascript:void()">2</a>
<a onmouseover="unit_select('layer3');" href="javascript:void()">3</a></body>
</html>
Thank you
