Question

假设我的页面中有一个框：

   <div id="test" style="width:200px; height:200px; background:yellow">
        this is a test
    </div>

我只是在我的页面中包含“jquery-1.6.2.min.js”

然后我想改变字体大小，所以我使用

$('#test').animate({ fontSize: "10em"}, "slow");

然后我要更改“test”框的background-color 我写道：

$('#test').animate({ 'background-color': '#000000' }, "slow");

但是直到我加入“jquery-ui-1.8.5.custom.min.js”它才行不通。

我认为原始的“jquery-1.6.2.min.js”文件已经包含了所有的animate函数， fontsize和background color都是css属性，但原始只能支持 fontsize改变？为什么呢？

我的问题是我认为包“jquery-ui-1.8.5.custom.min.js”仅用于 UI或其他一些东西。两者都用于css属性更改。

Answer 1

阅读.animate的jQuery文档：

所有动画属性都应设置为单个数值，   除非如下所述;大多数非数字属性不能   使用基本的jQuery功能进行动画制作。（例如，宽度，   高度或左边可以是动画但背景颜色不能。）

除非另有说明，否则属性值将被视为多个像素   指定。可以在适用的情况下指定单位em和％。

如果您想为background-color等属性设置动画，则必须使用jQuery UI（或其他一些插件），因为您已经注意到了。请注意，jQuery UI站点提供了自定义下载功能，因此如果您不想包含所有小部件，则只能选择核心库。

Answer 2

jQuery本身不支持颜色动画。 jQuery用户界面。曾经有一个单独的颜色插件，但现在似乎已经被吸收到UI中。

编辑：这是原始插件，您可以在没有用户界面的情况下使用它：http://plugins.jquery.com/files/jquery.color.js.txt