Another strange (list related) NN/Firefox Bug

5

50295

Hi!

Here's a followup to my earlier post http://tinyurl.com/dthhs
(Full URL:
http://groups-beta.google.com/group/comp.lang.javascript/browse_frm/thread/dfff447eb6e5afd7/)

In the code below, I've used lists to implement a drop-down menu, and
it works well in IE, but is sort of bugg in NN/FF. You'll notice that
when moving right down the list to the last item ("Asia"), the list
will sometimes fail to collapse, if you exit fom the bottom. Strangely,
this problem does not occur when the cursor exits the list at the side
as shown below.

|----------------------|
| |
No problems here -> | Asia | <- No problems here
| |
|----------------------|

^
|
PROBLEMS
WHEN EXITING
HERE

Is this doccumented? Is there a work-around? Its trivial but annoying.

Thanks,

- Olumide



////////////// HTML code ///////////////


<html>
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">
<title>Untitled Document</title>

<script type="text/javascript">

function hideMenu() {
document.getElementById("menuContainer").style.display =
"none";
}

function showMenu() {
document.getElementById("menuContainer").style.display =
"block";
}

</script>

<STYLE>
li {
background-color: #FFFFFF;
font-weight: normal;
font-family: arial;
font-size: 12px;

text-align: center;
margin: 0;
padding: 0;
border: 1px solid black;
height: 20px;
}

ul{
margin: 0;
padding: 0;
list-style: none;
width: 200px;
}

ul ul {
display: none;
}

a {
display: block;
width: 200px;
text-decoration: none;
color: #000000;
}

</STYLE>

</head>

<body>

<ul onMouseOver="showMenu()" onMouseOut="hideMenu()">
<li><a href="#">Continents</a></li>
<ul id="menuContainer">
<li><a href="#">Europe</a></li>
<li><a href="#">Africa</a></li>
<li><a href="#">America</a></li>
<li><a href="#">Asia</a></li>
</ul>
</ul>

</body>
</html>
 
5

50295

Hi!

Here's a followup to my earlier post http://tinyurl.com/dthhs
(Full URL:
http://groups-beta.google.com/group/comp.lang.javascript/browse_frm/thread/dfff447eb6e5afd7/)

In the code below, I've used lists to implement a drop-down menu, and
it works well in IE, but is sort of bugg in NN/FF. You'll notice that
when moving right down the list to the last item ("Asia"), the list
will sometimes fail to collapse, if you exit fom the bottom. Strangely,
this problem does not occur when the cursor exits the list at the side
as shown below.

|----------------------|
| |
No problems here -> | Asia | <- No problems here
| |
|----------------------|

^
|
PROBLEMS
WHEN EXITING
HERE

Is this doccumented? Is there a work-around? Its trivial but
annoying.


Lest I forget, the same thing happens in NN/FF when you quickly run the
mouse/cursor out of the list i.e. it does not collapse.

- Olumide
 
F

FredOz

annoying.


Lest I forget, the same thing happens in NN/FF when you quickly run the
mouse/cursor out of the list i.e. it does not collapse.

- Olumide

Same answer as last time - using onmouseover/out intrinsic events for
this in Firefox (and maybe Geko browsers in general?) is prone to
failure. Either use pure CSS menus or use onclick to dropdown/rollup
menus.

The ones here work in most popular browsers:

<URL:http://www.howtocreate.co.uk/tutorials/testMenu.html>
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,743
Messages
2,569,478
Members
44,899
Latest member
RodneyMcAu

Latest Threads

Top