Question

我正在使用jQuery在悬停时为我的导航按钮添加颜色更改动画。

我有.menu-horizontal和.menu-vertical。但由于某些原因，animate函数适用于.menu-horizontal，但不适用于.menu-vertical。

垂直菜单的颜色不会改变。

<script type="text/ecmascript">
$(document).ready(function () {
    $(".menu-horizontal ul li a").hover(function() {
        $(this).stop().animate({ height: "31px", backgroundColor: "#3185b7" }, 600);
    }, function() {
        $(this).stop().animate({ height: "31px", backgroundColor: "#4fb3d3" }, 600);
    });

    $(".menu-vertical ul li a").hover(function() {
        $(this).stop().animate({ height: "31px", backgroundColor: "#3185b7" }, 600);
    }, function() {
        $(this).stop().animate({ height: "31px", backgroundColor: "#4fb3d3" }, 600);
    });              
});
</script>

Answer 1

您无法仅使用jQuery为background-color制作动画。

（例如，宽度，高度或左边可以设置动画，但background-color不能。但

来源：http://api.jquery.com/animate/#animation-properties

选项1：首先使用background-color设置.css()，然后设置高度动画。

选项2 ：使用plugin来促进background-color动画。

jQuery动画问题

1 个答案: