Menu con javascript mucho más fiable y estandar que con css.
1 <html>
2 <head>
3
4 ^I<style>
5 ^I^I#submenu {
6 ^I^I^Ivisibility:hidden;
7 ^I^I^Ilist-style-type:none;
8 ^I^I^Ibackground-color:#adbfbd;
9 ^I^I^Iwidth:80px;
10 ^I^I}
11 ^I^I#submenu2 {
12 ^I^I^Ivisibility:hidden;
13 ^I^I^Ilist-style-type:none;
14 ^I^I^Ibackground-color:#adbfbd;
15 ^I^I^Iwidth:80px;
16 ^I^I}
17 ^I^I#menu {
18 ^I^I^Ilist-style-type:none;
19 ^I^I^Ibackground-color:#00bfbd;
20 ^I^I^Iwidth:40px;
21 ^I^I^Iheight:10px;
22 ^I^I}
23 ^I^I#menu2 {
24 ^I^I^Ilist-style-type:none;
25 ^I^I^Ibackground-color:#00bfbd;
26 ^I^I^Iwidth:40px;
27 ^I^I^Iheight:10px;
28 ^I^I}
29 ^I</style>
30
31 ^I<script>
32 ^I^Ifunction mostrar(nombreObjeto){
33 ^I^I^Idocument.getElementById(nombreObjeto).style. visibility="visible";}
34 ^I^Ifunction ocultar(nombreObjeto){
35 ^I^I^Idocument.getElementById(nombreObjeto).style. visibility="hidden";}
36 ^I</script>
37
38 </head>
39 <body>
40
41 ^I<ul id="menu">
42
43 ^I^I<li>
44 ^I^I^I<div id="menu" onMouseOver="mostrar('submenu'),ocultar('submenu2' )">Menu</div>
45 ^I^I^I<ul onMouseOut="ocultar('submenu')">
46 ^I^I^I^I<li id="submenu"><a href="#">submenu1</a></li>
47 ^I^I^I</ul>
48 ^I^I</li>
49
50 ^I^I<li>
51 ^I^I^I<div id="menu2" onMouseOver="mostrar('submenu2'),ocultar('submenu' )">Menu2</div>
52 ^I^I^I<ul onMouseOut="ocultar('submenu2')">
53 ^I^I^I^I<li id="submenu2"><a href="#">submenu2</a></li>
54 ^I^I^I</ul>
55 ^I^I</li>
56
57 ^I</ul>
58
59 </body>
60 </html>