Question

我尝试使用Jquery和Jquery颜色插件更改页面上Div元素的颜色。你能解释我在这里做错了什么吗？我试图将颜色改为红色，黄色，石灰色和蓝色......

 <!DOCTYPE html>
<html>
<head>
    <script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>  
    <script src="http://code.jquery.com/color/jquery.color.plus-names-2.1.2.js"></script>
<script>
    $(document).ready(function () {
        $("button").click(function () {
            var div = $("div");         
            div.animate({ height: '300px', opacity: '0.4',color:'red' }, 1000);
            div.animate({ width: '300px', opacity: '0.8',color:'yellow' }, 1200);
            div.animate({ height: '100px', opacity: '0.4',color:'lime' }, 1230);
            div.animate({ width: '100px', opacity: '0.8',color:'blue' }, 1234);
        });
    });
</script> 
</head>

<body>
<button>Start Animation</button>
<div style="background:#123456;height:100px;width:100px;position:absolute;">
</div>

</body>
</html>

Answer 1

css属性color设置文本的颜色，而不是背景颜色。它的css属性是background-color。

然而，jQuery期望css属性没有短划线和lower camel case。所以在jQuery中你会将它引用为backgroundColor：

div.animate({ height: '300px', opacity: '0.4', backgroundColor:'red' }, 1000);

使用jquery颜色插件为Div设置动画颜色

1 个答案: