0

我需要使用 jQuery 淡化 div（和图像）以显示下面的 div（带有可点击链接的文本）。

<script>
$(document).ready(function(){
$("img.a").hover(
function() {
$(this).stop().animate({"opacity": "0"}, "slow");
},
function() {
$(this).stop().animate({"opacity": "1"}, "slow");
});

});
</script>

使用上面的代码并且一切正常，直到我去点击链接。似乎顶部隐藏的 div 阻止我这样做。

尝试了 replaceWith 功能，它也允许我单击链接 - 但是当我鼠标移出时无法让它返回显示原始 div。此外，老板希望过渡是渐进的 - 就像褪色......

有什么建议么？

非常感谢！

希思

4

1 回答 1

0

好的 - 以下两种方法在大多数浏览器中都运行良好，但在 IE 中，只要我稍微移动鼠标，div 就会开始淡入和淡出 - 并且还可以建立一个队列或淡入/淡出事件的循环：

$(document).ready(function () {
    $("#goingimg").hover(
        function () { $(".going").fadeOut("normal",0); }, 
        function () { $(".going").fadeTo("normal",1); }
    );       
});

$(document).ready(function () {
    $("#goingimg").hoverIntent(function() {
        $(".gone").fadeOut("normal",0);
        $('#goingimg').hoverIntent(function(event) { event.stopPropagation(); });
    }, function() {
        $(".gone").fadeTo("normal",1);
        $('#goingimg').hoverIntent(function(event) { event.stopPropagation(); });
    });
});

我尝试了建议的 hoverIntent 插件和 event.stopPropagation 函数。尽管如此，在 IE 中 - 事情都非常糟糕。有没有人知道的解决方法？

非常感谢...

于 2010-05-06T05:02:32.780 回答