| css/javascript menu problems with Netscape
Menu flashes on scrolling in NS6+7, doen't appear at all in NS4 |
Addled
msg:1478215 | 2:43 pm on Jun 27, 2003 (gmt 0) |
Hi all, I've got a nice dynamic menu system mainly in css using lists as mentioned here a few times but with javascript to get the dynamic effect since only Netscape 7 supports the CSS version. It works fine in IE5 and 6 but in Netscape 6 (and 7) the submenu keeps redrawing (ie flashing) as I scroll down it. When I do the CSS-only version for Netscape 7 that works fine, so I guess the problem must be with the javascript. Any ideas? Code below:
(The NN4 version doesn't work at all!)
function showMenu(menuid, actuatorid, display) {
if (document.getElementById) {
// Standards Compliant code fork...
var menu = document.getElementById(menuid);
var actuator = document.getElementById(actuatorid);
menu.style.display=display;
if (display=="block") {
actuator.style.borderTop="1px solid #99CCFF";
actuator.style.borderBottom="1px solid #99CCFF";
}
else {
actuator.style.borderTop="1px solid White";
actuator.style.borderBottom="1px solid White";
}
}
else if (document.all) {
// IE 4/5 code fork...
var menu = document.all[menuid];
var actuator = document.all[actuatorid];
if (display=="block") {
menu.style.visibility="visible";
actuator.style.borderTop="1px solid #99CCFF";
actuator.style.borderBottom="1px solid #99CCFF";
}
else {
menu.style.visibility="hidden";
actuator.style.borderTop="1px solid White";
actuator.style.borderBottom="1px solid White";
}
}
else if (document.layers) {
// Nav 4.x code fork...
var menu = document.layers[menuid];
var actuator = document.layers[actuatorid];
if (display=="block") {
menu.visibility="show";
actuator.borderTop="1px solid #99CCFF";
actuator.borderBottom="1px solid #99CCFF";
}
else {
menu.visibility="hide";
actuator.borderTop="1px solid White";
actuator.borderBottom="1px solid White";
}
}
}
|
korkus2000
msg:1478216 | 2:28 am on Jun 28, 2003 (gmt 0) |
What does the function call look like?
|
Addled
msg:1478217 | 9:40 am on Jun 30, 2003 (gmt 0) |
Code showing how the menu is structured (edited, so there may be slight typos), the original is valid xhtml1.0:
<div id="menu">
<ul>
<li id="actlist1" class="submenu" onmouseover="showMenu('list1', 'actlist1', 'block')" onmouseout="showMenu('list1', 'actlist1', 'none')">
<a href="link.htm" title="title">Link txt</a>
<ul id="list1" class="submenu">
<li><a href="link.htm" title="title">Link txt</a></li>
<li><a href="link.htm" title="title">Link txt</a></li>
</ul>
</li>
<li id="actlist2" class="submenu" onmouseover="showMenu('list2', 'actlist2', 'block')"
onmouseout="showMenu('list2', 'actlist2' ,'none')"><a href="link.htm" title="title">Link
txt</a>
<ul id="list2" class="submenu">
<li id="actlist2a" class="submenu" onmouseover="showMenu('list2a', 'actlist2a',
'block')" onmouseout="showMenu('list2a', 'actlist2a' ,'none')"><a href="link.htm"
title="title">Link txt</a>
<ul id="list2a" class="submenu">
<li><a href="link.htm" title="title">Link txt</a></li>
<li><a href="link.htm" title="title">Link txt</a></li>
</ul>
</li>
<li><a href="link.htm" title="title">Link txt</a></li>
<li><a href="link.htm" title="title">Link txt</a></li>
</ul>
</li>
<li><a href="link.htm" title="title">Link txt</a></li>
<li><a href="link.htm" title="title">Link txt</a></li>
</ul>
</div>
|
|
|
