我正在使用 magento 和标准的顶级菜单(有 1 个子级别)。问题是,在 IE < 10 中,子菜单在悬停时闪烁然后消失。如何解决这个问题?希望只是用css。
的HTML:
<ul id="nav">
<li class="level0 nav-1 first level-top parent">
<a href="..." class="level-top" ><span>Level0</span></a>
<ul class="level0">
<li class="level1 nav-1-1 first">
<a href="..." ><span>Level1</span></a>
</li>
</ul>
</li>
</ul>
的CSS:
#nav {
padding: 0;
margin: 10px 0;
font-size: 13px;
height: 56px;
background: #5b4c43;
}
#nav ul,#nav div {
position: absolute;
width: 540px;
top: 56px;
left: -10000px;
background: #f2f2ed;
background-color: #f2f2ed;
border-radius: 5px;
border: 5px solid #fff;
padding: 35px;
}
#nav div ul {
position: static;
width: auto;
border: none;
}
/* All Levels */
#nav li {
text-align: left;
position: relative;
}
#nav li.over {
z-index: 998;
}
/* 1st Level */
#nav li {
float: left;
padding: 8px 0;
}
#nav li:hover,#nav li.active {
background: #40352f;
border-left: 1px solid #4e4e4e;
}
#nav ul li.level1 {
border: 0px;
padding: 0px !important;
height: auto !important;
border-bottom: 1px solid #b3a791;
width: 240px;
border-radius: 0px;
color: #39312b;
float: left;
margin-right: 30px;
}
/* Show menu */
#nav li ul.shown-sub,#nav li div.shown-sub {
left: 0;
z-index: 999;
}
#nav li .shown-sub ul.shown-sub,#nav li .shown-sub li div.shown-sub {
left: 100px;
}
js:在悬停时,它将类添加到 ul 和 li “over”和“shown-sub”