Mega Code Archive
Accessing Layers with JavaScript
<![CDATA[
/*
JavaScript Unleashed, Third Edition
by Richard Wagner and R. Allen Wyke
ISBN: 067231763X
Publisher Sams CopyRight 2000
*/
<html>
<head>
<title>JavaScript Unleashed</title>
<style type="text/css">
<!--
#layer1{
background-color: green;
height: 100;
left: 10;
position: absolute;
top: 50;
width: 100;
}
-->
</style>
<script type="text/javascript" language="JavaScript1.2">
<!--
// Create global variables for browser type
var layer = new String();
var style = new String();
// Determine if the browser is Internet Explorer, Navigator,
// or other. Also, set the layer variable depending on the
// type of access it needs.
function checkBrowser(){
if(navigator.userAgent.indexOf("MSIE") != -1){
layer = ".all";
style = ".style";
}else if(navigator.userAgent.indexOf("Nav") != -1){
layer = ".layers";
style = "";
}
}
// Take the state passed in, and change it.
function changeState(layerRef, state){
eval("document" + layer + "['" + layerRef + "']" + style +
".visibility = '" + state + "'");
}
//-->
</script>
</head>
<body onload="checkBrowser()">
<div name="layer1" id="layer1">
DIV 1
</div>
<form name="form1">
<input type="button" value="Hide"Image from book
onclick="changeState('layer1','hidden')">
<input type="button" value="Show"Image from book
onclick="changeState('layer1','visible')">
<form>
</body>
</html>
]]>