Question

我在停止jQuery fadeOut效果时遇到问题，并让它返回到css文件中指定的正确不透明度。

当鼠标进入.item时，.editing div会立即显示，并且css中定义的不透明度为90％。现在，当鼠标离开并在淡出期间重新进入时，不透明度将停留在当前淡出不透明度级别。见this jsFiddle

我可以找到的是，您应该在致电opacity(100)后致电stop()。见Q/A。问题是这对我不起作用，因为我想将它重置为css中定义的90％。

如果没有在javascript中硬编码正确的不透明度，任何人都知道怎么做？

HTML

<div class="list">
    <div class="item"><div class="editing">edit</div></div>
    <div class="item"><div class="editing">edit</div></div>
    <div class="item"><div class="editing">edit</div></div>
    <div class="item"><div class="editing">edit</div></div>
</div>

CSS

.editing {
    display: none;
    opacity: 0.9;
    filter: alpha(opacity=90);
}

的JavaScript

$(".item").hover(function() {
    // enter
    $(".editing", this).stop();
    $(".editing", this).show();
}, function() {
    // leave
    $(".editing", this).fadeOut(1000);
});

Answer 1

您需要设置jumpToEnd参数，请执行以下操作：

$(".item").hover(function() {
    // enter
    $(".editing", this).stop(true, true).show();
}, function() {
    // leave
    $(".editing", this).fadeOut(500);
});

见此处参考：
http://api.jquery.com/stop/#stop-clearQueue-jumpToEnd

小提琴：

http://jsfiddle.net/QShwJ/2/

将淡入淡出重置为css中定义的不透明度

1 个答案: