Welcome to WebmasterWorld Guest from 54.226.60.235

Forum Moderators: open

Message Too Old, No Replies

css/javascript menu problems with Netscape

Menu flashes on scrolling in NS6+7, doen't appear at all in NS4

     

Addled

2:43 pm on Jun 27, 2003 (gmt 0)

10+ Year Member



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

2:28 am on Jun 28, 2003 (gmt 0)

WebmasterWorld Senior Member korkus2000 is a WebmasterWorld Top Contributor of All Time 10+ Year Member



What does the function call look like?

Addled

9:40 am on Jun 30, 2003 (gmt 0)

10+ Year Member



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>
 

Featured Threads

Hot Threads This Week

Hot Threads This Month