jquery 淡入淡出 css 无效

Question

我正在尝试让背景根据闲置/运动改变颜色。

可行，但我无法使用 fadeIn 使其淡出。

JSFiddle - Working example without the fade

在

点淡化背景的最佳解决方案是什么

$("body").css('background-color','#000');

 $(document).ready(function () {
        var idleState = false;
        var idleTimer = null;
        $('*').bind('mousemove click mouseup mousedown keydown keypress keyup submit change mouseenter scroll resize dblclick', function () {
            clearTimeout(idleTimer);
            if (idleState == true) { 

                    $("body").css('background-color','#fff'); 

            }
            idleState = false;
            idleTimer = setTimeout(function () { 

                    $("body").css('background-color','#000');

                idleState = true; }, 2000);
        });
        $("body").trigger("mousemove");
});

Answer 1

您可以使用 animate 而不是 css 来实现您想要的。

 $('body').animate({"background-color":"#fff"}, 1000);

Answer 2

使用CSS.

body {
    transition: background-color 1s;
}

jquery 淡入淡出 css 无效

jquery fade css not working

jquery

css

fade