2

在使用 jquery mouseover 使其出现之前,如何让元素在隐藏时占用空间。

这是一个例子。

http://jsfiddle.net/Nj97k/

当我隐藏可见性时,图标不再在鼠标悬停时淡入。

4

2 回答 2

2

最初使不透明度为0

<a id='posttext'class='flagpost' style='color:grey;' href='javascript:void(0)'>
    <i style="opacity: 0 " class='icon-flag'>This is an icon</i>Flag
</a>​

然后正常淡入淡出:

$('.flagpost').mouseover(function() {
    $('.icon-flag').fadeTo(500, 1);

});
$('.flagpost').mouseleave(function() {
    $('.icon-flag').fadeTo(300, 0);
});​

演示在这里

于 2012-05-21T05:35:53.543 回答
2

您可以在您的元素上替换为,也可以立即触发display:nonejQuery事件为您执行此操作:opacity:0mouseleave

.icon-flag {
    opacity: 0;
}

或者

$('.flagpost')
    .mouseover(function(){
        $('.icon-flag').fadeTo(500,1);
    }).mouseleave(function(){
        $('.icon-flag').fadeTo(300,0);
    }).trigger("mouseleave");​​​​​
于 2012-05-21T05:41:11.310 回答