Jquery 如果是（'；：悬停（'；），则设置背景色动画不起作用

有人能指出我做错了什么吗？我只想淡出悬停按钮（菜单按钮的id）的背景色

JS:

如果（$（'menu-button'）。是（'：hover'））{
$（此）。设置动画({
背景颜色：“666”
})}否则{
$（此）。设置动画({
背景颜色：“FFF”
})};

您应该使用

.on（）

或者，这也可以通过纯CSS3实现

#menu-button {
    background-color: #FFF;
}

#menu-button:hover {
    background-color: #666;
    -webkit-transition: background-color 1000ms linear;
    -moz-transition: background-color 1000ms linear;
    -o-transition: background-color 1000ms linear;
    -ms-transition: background-color 1000ms linear;
    transition: background-color 1000ms linear;
}

---

您应该使用

.on（）

或者，这也可以通过纯CSS3实现

#menu-button {
    background-color: #FFF;
}

#menu-button:hover {
    background-color: #666;
    -webkit-transition: background-color 1000ms linear;
    -moz-transition: background-color 1000ms linear;
    -o-transition: background-color 1000ms linear;
    -ms-transition: background-color 1000ms linear;
    transition: background-color 1000ms linear;
}

---

+1.在本例中，将动画挂接到“鼠标进入”和“鼠标离开”事件上。如果只是更改颜色而没有添加更多功能，我会使用纯CSS3（一个改进是在普通菜单按钮选择器样式中包含过渡属性，以便在停止悬停在按钮上时启动动画。）只是为了进一步澄清，OP的代码只是在JS运行时检查#菜单按钮是否处于悬停状态，而不是挂接到事件侦听器中。+1。在本例中，将动画挂接到“鼠标输入”和“鼠标离开”事件上。如果只是更改颜色而没有添加更多功能，我会使用纯CSS3（一个改进是在普通菜单按钮选择器样式中包含过渡属性，以便在停止悬停在按钮上时启动动画。）只是为了进一步澄清，OP的代码只是在JS运行时检查#菜单按钮是否处于悬停状态，而不是挂接到事件侦听器。

#menu-button {
    background-color: #FFF;
}

#menu-button:hover {
    background-color: #666;
    -webkit-transition: background-color 1000ms linear;
    -moz-transition: background-color 1000ms linear;
    -o-transition: background-color 1000ms linear;
    -ms-transition: background-color 1000ms linear;
    transition: background-color 1000ms linear;
}

$(document).ready( function(){
    $('.menu-button').hover( function() {
        $( this ).animate({ backgroundColor: "#666" });
    }, function(){
        $( this ).animate({ backgroundColor: "#FFF" });
    });
});