Question

我正在尝试复制类似Facebook墙的效果，将鼠标悬停在Feed项上会显示“删除”按钮。该按钮在页面加载时不可见，但将鼠标悬停在该项目上会显示该特定项目的删除按钮。这是通过jQuery和CSS显示属性实现的。

这在Safari，Chrome和Firefox等浏览器中运行良好，但是来到Internet Explorer 7并且它是不行的。

以下是一个例子：

http://www.woohoobingo.com/wall.html

以上链接是网站内的一个呈现页面，其中悬停功能在Safari等人工作，但不在Internet Explorer 7中工作（由于缺乏资源而在其他版本中未经测试）。

如果有人能够解释如何纠正这个问题，那么当鼠标悬停在列表项而不是列表项中的文本时，IE会添加悬停类，那就太棒了。

Answer 1

嗨@Martin它正在工作，但不知何故删除按钮不被视为div或容器的一部分，它在悬停时显示它。我写了下面的东西，它运作良好。你可以从中获得任何线索。

<div id="divA" style="border:1px dotted white;width:500px;clear:both;">
<div id="divLogo" style="height:20px;width:20px;overflow:hidden;float:left;">
    <img src="arrow.png" alt="logo" style="height:20px;width:20px;"/>
</div>
<div>Hello World this is the message written on the wall.....</div>
<div id="divDelBtn" style="width:50px;height:25px;top:1px;float:right;">
<span style="background-color:#c0c0c0;color:#ffeeee;display:none;">Delete</span>
</div>
<div id="otherStuff" style="font-size:70%;color:#0f0f33;">
    posted by @me on 18/jan/2010 12:34 PM</div>
</div>

<script type="text/javascript">
$(function(){
$("#divA").hover(function(){
    $("#divA").css("border-color","red");
    $("#divA #divDelBtn span").show();
},
function(){
    $("#divA").css("border-color","white");
    $("#divA #divDelBtn span").hide();
});
});
</script>

悬停在IE7中无法正常工作

1 个答案: