Menu
Could someone please look at the code below and explain why some bits work but other don’t.
It seems point to the file.
In all the well behaved browsers it makes the layer visible and then hides it again. In IE6 it shows the layer but then brings up all the files in the folder from which the page is run.
Code:-
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN”
“
<html xmlns=”
<head>
<meta name=”generator”
<meta http-equiv=”content-type”
content=”text/html; charset=ISO-8859-1″ />
<title>show/hide div</title>
<style type=”text/css”>
body {
font-size: 100%;
}
p {
font-size: 1em;
}
h1, h2 {
text-align: center;
}
</style>
<script language=”JavaScript”>
<!–
function SymError()
{
return true;
}
window.onerror = SymError;
var SymRealWinOpen = window.open;
function SymWinOpen(url, name, attributes)
{
return (new Object());
}
window.open = SymWinOpen;
//–>
</script>
<script type=”text/javascript”>
function change(which) {
document.getElementById(‘div1’).style.display = ‘none’;
document.getElementById(‘div2’).style.display = ‘none’;
document.getElementById(‘div3’).style.display = ‘none’;
document.getElementById(which).style.display = ‘block’;
}
function cleardiv() {
document.getElementById(‘div1’).style.display = ‘none’;
document.getElementById(‘div2’).style.display = ‘none’;
document.getElementById(‘div3’).style.display = ‘none’;
}
</script>
</head>
<body>
<h1>Switch Divs</h1>
<p>Click on a button, new layer appears. </p>
<p>MouseOver Link #1, new layer appears. </p>
<p>MouseDown Link #2 or OnClick Link #3, new layer appears and then jumps to Folders. </p>
<p>
<input name=”Button” type=”button” onclick=change(“div1″) value=”Layer 1” />
<input name=”Button” type=”button” onclick=change(“div2″) value=”Layer 2” />
<input name=”Button” type=”button” onclick=change(“div3″) value=”Layer 3” />
</p>
<p>Select Layer:
<a href=”” onMouseover=”change(‘div1’);”>Layer 1</a> |
<a href=”” onMousedown=”change(‘div2’);”>Layer 2</a> |
<a href=”” onmousedown=”change(‘div3’)”>Layer 3</a>
</p>
<div id=”div1″ style=”display: none; background-color:#30F;”>
<h2>Division 1</h2>
</div>
<div id=”div2″ style=”display: none; background: #8f8;”>
<h2>Division 2</h2>
</div>
<div id=”div3″ style=”display: none; background: #f88;”>
<h2>Division 3</h2>
</div>
</body>
<script language=”JavaScript”>
<!–
window.open = SymRealWinOpen;
</script>
</html>