SitePoint Sponsor |
|
User Tag List
Results 1 to 3 of 3
Thread: javascript menu problem with IE
-
Feb 22, 2007, 13:19 #1
- Join Date
- Dec 2004
- Location
- USA
- Posts
- 1,407
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
javascript menu problem with IE
The code below works fine in Firefox. The way it works in IE is that when you hover over a main menu, the sub-menus pop out as expected. BUT when you move the mouse to a sub-menu, the sub-menus disappear.
Maybe it's working IE it's programmed but working the way I want it to in Firefox.
Either way, the way I want it to work is when mouse form main menu to sub-menu, the sub-menu stays out there until you mouse to another main menu, click on a sub-menu, click on another part of the page. This is the way I think most pop-out menus work.
How do you fix this to work in IE also?
HTML Code:<script type="text/javascript"> function showMenu(elmnt) { document.getElementById(elmnt).style.display="block" } function showNoMenu(elmnt) { document.getElementById(elmnt).style.display="none" } </script> ... <ul> <li><a href="/">Home</a></li> <li><a href="#" onMouseOver="javascript:showMenu('subMenu');" onMouseOut="javascript:showNoMenu('subMenu');">Your Coverage</a> <ul ID="submenu"> <li><a href="link1.php">link1</a></li> <li><a href="link2.php">link2</a></li> <li><a href="link3.php">link3</a></li> </ul> </li> </ul>
Last edited by WebDevGuy; Feb 23, 2007 at 08:39.
-
Feb 23, 2007, 11:33 #2
- Join Date
- Nov 2004
- Location
- Nelson BC
- Posts
- 2,310
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Well, you have set the event handlers to watch the mouseover and mouseout of the <a> tag. Unfortunately, the <a> tag does not include the submenu, so when you mouse over the submenu, hey presto it disappears.
I would eliminate the <a> tag altogether and put the onmouseover and onmouseout handlers directly in the <li> tag, which DOES include the submenu and shouldn't have this problem.
Code:<ul> <li><a href="/">Home</a></li> <li onmouseover="showMenu('subMenu');" onmouseout="showNoMenu('subMenu');">Your Coverage <ul ID="submenu"> <li><a href="link1.php">link1</a></li> <li><a href="link2.php">link2</a></li> <li><a href="link3.php">link3</a></li> </ul> </li> </ul>
-
Feb 26, 2007, 09:32 #3
- Join Date
- Dec 2004
- Location
- USA
- Posts
- 1,407
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
works terrific - thanks
Bookmarks