悬停，DIV 淡入但不淡出答案

【问题标题】：Hover, DIV fades in but not out悬停，DIV 淡入但不淡出
【发布时间】：2012-02-03 01:03:07
【问题描述】：

$(document).ready(function(){
    $(".thumbnail").hover(
        function(){
            $(".overthumb").fadeTo(1000,1).show();
        },
        function(){
            $(".overthumb").fadeTo(1000,0).hide();
        }
    );
});

http://jsfiddle.net/AndyMP/qCa7a/2/

上面的代码使 DIV 淡入，但由于某种原因不会淡出。

也许 FadeOut 不是最好的方法？

【问题讨论】：

标签： jquery

【解决方案1】：

正如丹尼尔所说，你不需要打电话给hide()，但你也不需要打电话给show()。

附注 - 您正在使用函数 fadeTo()，它主要用于将元素淡化为特定的不透明度值（即 4%）。看到你只是从 0% 到 100% 淡化元素，反之亦然，你可以分别使用这些函数：fadeIn() & fadeOut()。

以下是使用上述函数的示例：

    // Bind the event to the required element
    $('#elementid').hover(
        function(){

            // Call the function on a specific element to fade in
            $('.overthumb').fadeIn(1000);

        },
        function(){

            // Call the opposite function on the same element to fade out
            $(".overthumb").fadeOut(1000);
        }
    );

这里是指向以下函数的 jQueryAPI 文档的链接：fadeIn() & fadeOut()

【讨论】：

刚注意到上面的cmets，忙着写回复。
这个答案比选择的那个更彻底。它还为正在执行的任务提供了更好的功能选择。

【解决方案2】：

不要打电话给hide。

http://jsfiddle.net/qCa7a/3/

【讨论】：

也不要调用 show - fadeTo(1000, 1) 等价于 .show(1000) 所以不需要显示。
我建议放置一个 stop(true,false) 以防止效果自我重复。
如何让第二个 DIV 覆盖第一个？
我遇到的问题是它似乎混淆了淡入/淡出过程。