jQuery animate()实现背景色渐变效果的处理方法【使用jQuery.color.js插件】


Posted in Javascript onMarch 15, 2017

本文实例讲述了jQuery animate()实现背景色渐变效果的处理方法。分享给大家供大家参考,具体如下:

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

核心代码:

$(function(){
$("#cdiv").animate(


{
  
backgroundColor:'#FF0000'
  },1000

 )
})

完整代码如下:

<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<title>背景色渐变效果</title>
</head>
<body>
  <script language="javascript" type="text/javascript" src="jquery-1.7.2.min.js"></script>
  <script type="text/javascript" src="js/jquery.color.js"></script>
  <div id='cdiv' style='width:200px;height:100px;background-color:white'></div>
  <script>
  $(function(){
    $("#cdiv").animate(
      {
        backgroundColor:'#FF0000'
      },1000
    )
  })
  </script>
</body>
</html>

运行效果图如下:

 jQuery animate()实现背景色渐变效果的处理方法【使用jQuery.color.js插件】

Javascript 相关文章推荐
初学Javascript的一些总结
Nov 03 Javascript
网站页面自动跳转实现方法PHP、JSP(上)
Aug 01 Javascript
使用jQuery+HttpHandler+xml模拟一个三级联动的例子
Aug 09 Javascript
修复ie8&amp;chrome下window的resize事件多次执行
Oct 20 Javascript
js事件绑定快捷键以ctrl+k为例
Sep 30 Javascript
纯javascript实现的小游戏《Flappy Pig》实例
Jul 27 Javascript
使用JS实现图片展示瀑布流效果的实例代码
Sep 12 Javascript
JS中数组重排序方法
Nov 11 Javascript
js实现右键菜单功能
Nov 28 Javascript
走进AngularJs之过滤器(filter)详解
Feb 17 Javascript
AngularJS日程表案例详解
Aug 15 Javascript
JavaScript Tab菜单实现过程解析
May 13 Javascript
js中的触发事件对象event.srcElement与event.target详解
Mar 15 #Javascript
jQuery动态产生select option下拉列表
Mar 15 #Javascript
使用jQuery实现一个类似GridView的编辑,更新,取消和删除的功能
Mar 15 #Javascript
js中获取键盘按下键值event.keyCode、event.charCode和event.which的兼容性详解
Mar 15 #Javascript
jQuery实现移动端Tab选项卡效果
Mar 15 #Javascript
利用vue.js插入dom节点的方法
Mar 15 #Javascript
js实现彩色条纹滚动条效果
Mar 15 #Javascript
You might like
php实现的在线人员函数库
2008/04/09 PHP
Zend Studio 无法启动的问题解决方法
2008/12/04 PHP
重新封装zend_soap实现http连接安全认证的php代码
2011/01/12 PHP
Trying to clone an uncloneable object of class Imagic的解决方法
2012/01/11 PHP
PHP json_encode中文乱码问题的解决办法
2013/09/09 PHP
php中的curl_multi系列函数使用例子
2014/07/29 PHP
PHP排序算法类实例
2015/06/17 PHP
thinkphp3.2实现在线留言提交验证码功能
2017/07/19 PHP
Yii2.0框架behaviors方法使用实例分析
2019/09/30 PHP
基于jquery的tab切换 js原理
2010/04/01 Javascript
zeroclipboard复制到剪切板的flash
2010/08/04 Javascript
Node.js中require的工作原理浅析
2014/06/24 Javascript
jQuery对象的链式操作用法分析
2016/05/10 Javascript
jQuery ajax方法传递中文时出现中文乱码的解决方法
2016/07/25 Javascript
JavaScript通过mouseover()实现图片变大效果的示例
2017/12/20 Javascript
浅谈使用mpvue开发小程序需要注意和了解的知识点
2018/05/23 Javascript
Vue.js+cube-ui(Scroll组件)实现类似头条效果的横向滚动导航条
2019/06/24 Javascript
JavaScript实现身份证验证代码实例
2019/08/26 Javascript
Vue如何循环提取对象数组中的值
2020/11/18 Vue.js
[02:36]DOTA2混沌骑士 英雄基础教程
2013/11/26 DOTA
详解Python自建logging模块
2018/01/29 Python
Python K最近邻从原理到实现的方法
2019/08/15 Python
django多种支付、并发订单处理实例代码
2019/12/13 Python
pytorch GAN伪造手写体mnist数据集方式
2020/01/10 Python
python matplotlib imshow热图坐标替换/映射实例
2020/03/14 Python
浅谈Python里面None True False之间的区别
2020/07/09 Python
python爬取音频下载的示例代码
2020/10/19 Python
MYPROTEIN澳大利亚官方网站:欧洲运动营养品牌
2019/06/26 全球购物
党员干部2014全国两会学习心得体会
2014/03/10 职场文书
成语的广告词
2014/03/19 职场文书
社团活动总结模板
2014/06/30 职场文书
教师思想作风整顿个人剖析材料
2014/10/10 职场文书
第二次离婚起诉书
2015/05/18 职场文书
护士岗前培训心得体会
2016/01/08 职场文书
MyBatis XPathParser解析器使用范例详解
2022/07/15 Java/Android
MySQL下载安装配置详细教程 附下载资源
2022/09/23 MySQL