我有一个 Action 列表,当我将鼠标悬停在链接上时会显示该列表。它在 firefox 3.6 和 Ie8 中工作正常,但在 IE7 中工作不一样。
这是我的代码:
<td class="noTableStyle">
<a href="#">Actions</a>
<ul>
<li><a href="#" title="Edit">Edit</a></li>
<li><a id="Delete" href="#">Delete</a></li>
</ul>
</td>
这是我的 Jquery 代码:
$(document).ready(function() {
//Initialize action menu behaviour
$("td.noTableStyle ul").hide();
$("td.noTableStyle a").hover(function() {
$(this).next().slideDown('fast');
});
$("td.noTableStyle").hover(null, function() { $(this).children("ul").slideUp('fast'); });
});
这是我的 CSS:
d.noTableStyle {
background-color:Transparent;
}
td.noTableStyle ul {
margin-top:0px;
list-style-type:none;
z-index: 2;
position:absolute;
float:left;
background-color: #EBF5F8;
margin-left: 1px;
padding-left:0px;
}
td.noTableStyle ul {
background-color:#EBF5F8;
padding:2px;
}
在 firefox/IE8 中,链接显示在操作中,但在 IE7 中,编辑和删除链接出现在右侧。
我真的很想得到一些帮助。谢谢大家
最佳答案
position: absolute;
的组合和 float: left;
让它粘在链接的右侧。因为您想将它放在正下方 链接和 <ul>
默认情况下已经是一个 block 元素,我看不到制作它的任何值(value) position: absolute; float: left;
.所以我建议只删除这些属性。它将以您期望的方式在所有浏览器中运行。
关于jquery - IE7 表现奇怪,悬停在 ul li 列表上没有任何中断,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2941892/