Question

jquery 的animate()方法可以改变背景颜色么？

我写的代码为什么改变不了背景颜色呢？$("div:contains('你好')").click(function(){
$(this).animate({background:"red"},3000)
})

Answer 1

jquery 的animate()方法是不可以改变背景颜色的，如果想改变背景颜色，需要引入jquery.color插件，再用animate（）来实现背景色变化，具体代码如下：

<script src='jquery.animate-colors.js'></script>

$("div:contains('你好')").click(function(){$(this).animate({background:"red"},3000)})

下面是实现背景色改变的结果：

扩展资料

jquery改变背景颜色的动态方法

1、脚本方法：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script

<select class="rez"> <option value="Not Confirmed">Not Confirmed</option>

2、选定方法： 

<option value="Confirmed" selected="selected">Confirmed</option></select><select class="rez">

<option value="Not Confirmed" selected="selected">Not Confirmed</option>

<option value="Confirmed">Confirmed</option></select>

Answer 2

可以，当使用 animate() 时，必须使用 Camel 标记法书写所有的属性名，比如，必须使用 paddingLeft 而不是 padding-left，使用 marginRight 而不是 margin-right。backgroundColor。颜色动画不包含在核心 jQuery 库中。如果您想要应用动画颜色，您需要从 jQuery.com 下载 颜色动画插件。

$("div:contains('你好')").click(function(){

$(this).animate({backgroundColor:"red"},3000)
})。

扩展资料：

animate()方法样式值：backgroundPosition，borderWidth，borderBottomWidth，borderLeftWidth，borderRightWidth，borderTopWidth，borderSpacing，margin。

marginBottom，marginLeft，marginRight，marginTop，outlineWidth，padding，paddingBottom，paddingLeft，paddingRight，paddingTop，height，width。

maxHeight，maxWidth，minHeight，minWidth，font，fontSize，bottom，left，right，top，letterSpacing，wordSpacing，lineHeight，textIndent。

Answer 3

页面上只引用一个jquery的脚本是不行的,color属于ui,在引用一个jquery-ui的脚本就可以了。解决方法如下：

1、首先新建一个HTML文档，并引入jquery。

2、定义一个<p>元素，并将其设置为一个长宽为100px的蓝色方块。

3、保存以上内容，并在浏览器预览效果。

4、为<p>元素设置animate()动画方法，使其被点击之后，在3秒之中实现宽度变大，高度变小，成为一个长方形。

5、保存以上文件，就可以在浏览器预览一个基本的jquery的animate()的颜色效果图。

Answer 4

jquery animate函数不能处理背景色渐变，需要使用jquery.color插件

gitHub地址：https://github.com/jquery/jquery-color/

$(function(){
　　$("#cdiv").animate(
　　　　{
　　backgroundColor:'#FF0000'
},1000<br>　　　)

})

演示地址：

http://runjs.cn/detail/xmax7vo3　

引用自：http://www.cnblogs.com/haitao-fan/p/3903501.html

Answer 5

jquery的animate不能改变background-color；
原文：
All animated properties should be animated to a single numeric value, except as noted below; most properties that are non-numeric cannot be animated using basic jQuery functionality(For example, width, height, or left can be animated but background-color cannot be, unless the jQuery.Color() plugin is used)