我为 joomla 网站创建了一个非常基本的悬停 css 菜单（如果可以避免的话，我真的不想进入 jQuery）。它在除 IE (10,9...) 之外的所有应用程序中都能正常工作。
当您将鼠标悬停在顶层并将移动移动到子菜单上时，子菜单会保留在除 IE 之外的所有内容中。
如何让 IE 玩球？0
这是html：
<ul class="menu" id="mainMenu">
<li class="item-210"><a href="/index.php/home-2" >Home</a></li>
<li class="item-213 current active deeper parent"><a href="/index.php/xbus2" >xBus</a>
<ul>
<li class="item-214"><a href="/index.php/xbus2/vision" >Vision</a></li>
<li class="item-215"><a href="/index.php/xbus2/timetable" >Timetable</a></li>
<li class="item-217"><a href="/index.php/xbus2/xbus-mini" >xBus Mini</a></li>
<li class="item-218"><a href="/index.php/xbus2/xbus2" >xBus2</a></li>
</ul>
</li><li class="item-220 deeper parent"> etc ....
这是CSS
ul#mainMenu li {
position:relative;
}
ul#mainMenu ul {
position:absolute;
width:150px;
top:17px;
left:-9999px;
text-align:left;
background-color:#000;
z-index:5;
}
ul#mainMenu ul li {
display:block;
border-top:1px solid #999;
}
ul#mainMenu ul li:first-child {
border-top:none;
}
ul#mainMenu ul li a {
font-size:14px;
line-height:2em;
color:pink;
}
ul#mainMenu li:hover ul {
left:0px;
}