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 相关文章推荐
js 加载时自动调整图片大小
May 28 Javascript
jQuery控制iFrame(实例代码)
Nov 19 Javascript
浅谈javascript的分号的使用
May 12 Javascript
jquery实现倒计时功能
Dec 28 Javascript
JavaScript jquery及AJAX小结
Jan 24 Javascript
jQuery的each循环用法简单示例
Jun 12 Javascript
ES6新特性三: Generator(生成器)函数详解
Apr 21 Javascript
浅析JavaScript中的平稳退化(graceful degradation)
Jul 24 Javascript
js注册时输入合法性验证方法
Oct 21 Javascript
解决vue 路由变化页面数据不刷新的问题
Mar 13 Javascript
Vue 页面权限控制和登陆验证功能的实例代码
Jun 20 Javascript
详解小程序横屏方案对比
Jun 28 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持久连接mysql_pconnect()函数使用介绍
2012/02/05 PHP
php实现水仙花数示例分享
2014/04/03 PHP
常用的php图片处理类(水印、等比缩放、固定高宽)分享
2015/06/19 PHP
优化WordPress中文章与评论的时间显示
2016/01/12 PHP
thinkPHP实现基于ajax的评论回复功能
2018/06/22 PHP
PHP 构造函数和析构函数原理与用法分析
2020/04/21 PHP
js操作Xml(向服务器发送Xml,处理服务器返回的Xml)(IE下有效)
2009/01/30 Javascript
javascript中的array数组使用技巧
2010/01/31 Javascript
chrome原生方法之数组
2011/11/30 Javascript
JS获取并操作iframe中元素的方法
2013/03/21 Javascript
js实现点击左右按钮轮播图片效果实例
2015/01/29 Javascript
tuzhu_req.js 实现仿百度图片首页效果
2015/08/11 Javascript
浅谈Vue Element中Select下拉框选取值的问题
2018/03/01 Javascript
浅析Vue实例以及生命周期
2018/08/14 Javascript
js实现web调用摄像头 js截取视频画面
2019/04/21 Javascript
微信小程序把百度地图坐标转换成腾讯地图坐标过程详解
2019/07/10 Javascript
springboot+vue+对接支付宝接口+二维码扫描支付功能(沙箱环境)
2020/10/15 Javascript
[01:35]2018年度CS GO最佳战队-完美盛典
2018/12/17 DOTA
Python线程指南详细介绍
2017/01/05 Python
简单实现python进度条脚本
2017/12/18 Python
wxPython之解决闪烁的问题
2018/01/15 Python
python实现控制台打印的方法
2019/01/12 Python
Pycharm远程调试原理及具体配置详解
2019/08/08 Python
安装完Python包然后找不到模块的解决步骤
2020/02/13 Python
python的sys.path模块路径添加方式
2020/03/09 Python
Python实现七个基本算法的实例代码
2020/10/08 Python
中国跨境电商:Tomtop
2017/03/16 全球购物
庆八一活动方案
2014/01/25 职场文书
先进班级集体事迹材料
2014/01/30 职场文书
个人收入证明模板
2014/09/18 职场文书
大学迎新生标语
2014/10/06 职场文书
毕业生银行实习自我鉴定
2014/10/14 职场文书
教师先进事迹材料
2014/12/16 职场文书
医院科室评语
2015/01/04 职场文书
单位接收函范文
2015/01/30 职场文书
css弧边选项卡的项目实践
2023/05/07 HTML / CSS