jquery动态改变背景颜色插件
背景颜色用animate方法时时无法改变颜色的
所以要使用插件进行补充。
用法:
<!DOCTYPE html>
<html>
<head>
<style>
div {
background-color: #bada55;
width: 100px;
border: 1px solid green;
}
</style>
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="jquery.color.min.js"></script>
</head>
<body>
<button id="go">Simple</button>
<button id="sat">Desaturate</button>
<div id="block">Hello!</div>
<script>
jQuery("#go").click(function(){
jQuery("#block").animate({
backgroundColor: "#abcdef"
}, 1500 );
});
jQuery("#sat").click(function(){
jQuery("#block").animate({
backgroundColor: jQuery.Color({ saturation: 0 })
}, 1500 );
});
</script>
</body>
</html>
jquery动态改变背景颜色插件的更多相关文章
- jquery动态改变div宽度和高度
效果体验:http://keleyi.com/keleyi/phtml/jquery/23.htm 完整代码: <!DOCTYPE html PUBLIC "-//W3C//DTD X ...
- [JS9] document's bgColor改变背景颜色
<HTML> <HEAD> <TITLE>设置背景颜色</TITLE> </HEAD> <BODY> <CENTER> ...
- OpenGL的glClearColor和glClear改变背景颜色
OpenGL的glClearColor和glClear改变背景颜色 结合以下两个函数void glClearColor(GLclampf red, GLclampf green, GLclamp ...
- 一款非常炫酷的jQuery动态随机背景滚动特效
一款非常炫酷的jQuery动态随机背景滚动特效 图片背景会不停息的滚动,带有那种漂浮的视觉效果,小圈圈飘动. 更好的是还兼容IE6浏览器,大伙可以好好研究研究. 适用浏览器:IE6.IE7.IE8.3 ...
- WPF动态改变主题颜色
原文:WPF动态改变主题颜色 国内的WPF技术先行者周银辉曾介绍过如何动态改变应用程序的主题样式,今天我们来介绍一种轻量级的改变界面风格的方式--动态改变主题色. 程序允许用户根据自己的喜好来对界面进 ...
- jQuery动态网格瀑布流插件Masonry
Masonry是一款非常强大的jQuery动态网格布局插件,可以帮助开发人员快速开发瀑布流界面效果.和CSS中float的效果不太一样的地方在于,float先水平排列,然后再垂直排列,使用Masonr ...
- iOS 创建多个button实现点击改变背景颜色
工程中需要实现与UISegmentedControl效果相似的一排一共十个button,如下图.但是SegmentedControl修改不太方便,就用button替代, 循环创建十个button,点击 ...
- CSS 之动态变换背景颜色
先上效果图 HTML代码: 123456789 <div class="header"> <h1>GCCHRN'S BLOG</h1> < ...
- xml中,button改变背景颜色方法
在画几个设置界面,用到了button控件,对于button空间的背景色在不同状态下的颜色改变方法,做了一下尝试,发现了两种背景颜色改变的方法,就总结了下. 方法一尝试了好多遍才好,要点在于,在sele ...
随机推荐
- SolrCloud简介
原文地址:http://www.chepoo.com/solrcloud-introduction.html 一.简介 SolrCloud是Solr4.0版本以后基于Solr和Zookeeper的分布 ...
- eclipse、MyEclipse实现批量改动文件编码
在使用eclipse或MyEclipse编程时,常常遇到部分文件打开后出现乱码的情况(特别是在导入项目后) 1:右击项目选择properties->Resource>Other选择UTF- ...
- IOS 获取网络图像尺寸 更改 图像色彩值 什么一套方法灰色
直接在代码 头文件 // 图片处理 0 半灰色 1 灰度 2 深棕色 3 反色 +(UIImage*)imageWithImage:(UIImage*)image grayLevelType:(UII ...
- Android进程内存上限
Android应用程序都是在自己单独的进程中运行.Android为不同类型的进程分配了不同的内存使用上限,如果应用进程使用的内存超过了这个上限,则会抛出Out Of Memory异常,接着进程也被ki ...
- HDU4707:Pet(DFS)
Problem Description One day, Lin Ji wake up in the morning and found that his pethamster escaped. He ...
- HDU 4160 Dolls (最小路径覆盖=顶点数-最大匹配数)
Dolls Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Total Submiss ...
- 基于Server-Sent Event的简单聊天室 Web 2.0时代,即时通信已经成为必不可少的网站功能,那实现Web即时通信的机制有哪些呢?在这门项目课中我们将一一介绍。最后我们将会实现一个基于Server-Sent Event和Flask简单的在线聊天室。
基于Server-Sent Event的简单聊天室 Web 2.0时代,即时通信已经成为必不可少的网站功能,那实现Web即时通信的机制有哪些呢?在这门项目课中我们将一一介绍.最后我们将会实现一个基于S ...
- Linux解压乱码
.向系统添加windows下的字符编码: sudo vim /var/lib/locales/supported.d/local 添加一下编码: zh_CN.GBK GBK zh_CN.GB2312 ...
- 解决linux下javac -version和java -version版本显示不一致
解决linux下javac -version和java -version版本显示不一致 [javascript] view plaincopy [root@localhost usr]# $JAVA_ ...
- 每天4个linux命令--步骤一
1 :Linux的诞生 Linux由芬兰赫尔辛基大学的Linus Torvalds创建 1991年10月,Linux第一个公开版 0.02版发布 1994年3月,Linux 1.0版发布 Linus ...