Menu
In the attached code, I get no errors running in either the MSIE or FF browsers.
BUT, the actions are different. I’m trying to figure out why. ?
[code]
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<title>Mobile Test</title>
<meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″ />
<meta name=”viewport” content=”width=device-width”>
<meta name=”viewport” content=”initial-scale=1.0, user-scalable=no”/>
<style type=”text/css”> /* clubs.css */
@media print { body { font-size: 16pt } }
@media screen { body { font-size: 20px } }
@media handheld { body { font-size: 24px } }
@media screen, print { body { line-height: 1.2 } }
.sect { display:none; }
</style>
<script type=”text/javascript”>
function $_(IDS) { return document.getElementById(IDS); }
function show_visibility(IDS){
hide_visibility(IDS);
toggle(IDS);
}
function hide_visibility(IDS){
var sel = document.getElementsByName(‘sect’);
for (var i=0; i<sel.length; i++) {
if (sel[i].id != IDS) { sel[i].style.display = ‘none’; }
}
}
function toggle(IDS) {
var CState = $_(IDS);
if (CState.style.display != “block”) { CState.style.display = “block”; }
else { CState.style.display = “none”; }
}
</script>
</head>
<body>
<div>
<span style=”color:#000;font-size:24px”> Title Information </span> <hr>
</div>
<a href=”#” onclick=”show_visibility(‘foo1′)”> Welcome! </a><br>
<div name=”sect” id=’foo1’ class=”sect” style=”background:#F9C”>
Welcome information.
</div>
<hr>
<a href=”#” onclick=”show_visibility(‘foo2′)”> Interests </a><br>
<div name=”sect” id=’foo2’ class=”sect” style=”background:#FCF”>
Interest information.
</div>
<hr>
<a href=”#” onclick=”show_visibility(‘foo3′)”> Links</a><br>
<div name=”sect” id=’foo3’ class=”sect” style=”background:#99C”>
Links information.
</div>
<hr>
<a href=”#” onclick=”show_visibility(‘foo4′)”> Projects</a><br>
<div name=”sect” id=’foo4’ class=”sect” style=”background:#9C9″>
Project information.
</div>
<hr>
<a href=”#” onclick=”show_visibility(‘foo5′)”> About </a><br>
<div name=”sect” id=’foo5’ class=”sect” style=”background:#6FC”>
About information.
</div>
<hr>
</body>
</html>
Here’s a description of the problem (to me).
It works as designed and intended in FF browser:
1. Each section opens when clicked on, and
2. Other sections close when a section is chosen, and
3. Same section closes when clicked in succession. (same for both)
In the MSIE browser, it works as this:
1. Each section opens when clicked on, but
2. Other sections open also when chosen and first selection stays open and
3. Same section closes when clicked in succession. (same for both)
Any reason for this in MSIE and FF browsers for #1 and #2 above?
Any idea how to make both scripts work the same in both browsers?
Try it with the two different browsers to see the problem I’m having. 😮