jquery.color.js的使用
Jquery本身不支持变色，Jquery Color.js弥补了这缺陷并为animate动画赋予变色效果，如下红变蓝后执行回调再由蓝变红。
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<style>
#box {
width:100px;
height:100px;
background-color:red;
cursor:pointer;
}
</style>
</head>
<body>
<div class="box" id="box"></div>
<script type="text/javascript" src="/js/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="/js/jquery.color.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#box").mouseenter(function () {
$(this).stop(true, true).animate({ "backgroundColor": 'blue' }, 5400, function () {
$(this).animate({ "backgroundColor": 'red' }, 5400);
});
});
});
</script>
</body>
</html>
支持的其他属性如下
backgroundColor, borderBottomColor, borderLeftColor, borderRightColor, borderTopColor, color, columnRuleColor, outlineColor, textDecorationColor, textEmphasisColor
jquery.color.js的使用的更多相关文章
- jquery.color.js
经过测试,可以使用. 2016-12-22 21:39:45 /*! * jQuery Color Animations v2.1.2 * https://github.com/jquery/jqu ...
- jQuery---jquery.color.js和jquery.lazyload.js的使用
jquery.color.js的使用 了解即可 <!--1. 引入jquery的js文件--> <script src="jquery-1.12.4.js"> ...
- jquery.jCal.js显示日历插件
描述:日历插件jCal用于需要输入日期的表单文本框. 兼容浏览器:IE浏览器/Firefox/Google Chrome 官方链接: http://www.overset.com/2008/05/1 ...
- 表单验证插件之jquery.validate.js
提到表单验证的插件,第一个想到的就是jquery.validate.js,所以小生想在这里稍微详细地说一下这款插件的具体使用方法,便于理解,我直接附上整段demo的代码(没怎么调样式,主要是看js): ...
- 初探jquery.slimscroll.js和iscroll5.js
网上关于实现各种滚动效果的插件不胜枚举,这里,我简单介绍一下自己用过的两款比较有代表性的插件: 1.jquery.slimscroll.js,需要先引入jquery类库,主要用于模拟传统的浏览器滚动条 ...
- 用jquery.pager.js实现分页
1.html <link href="/stylesheets/Pager.css" rel="stylesheet" type="text/c ...
- jQuery验证控件jquery.validate.js使用说明
官网地址:http://bassistance.de/jquery-plugins/jquery-plugin-validation jQuery plugin: Validation 使用说明 转载 ...
- jquery.validate.js插件使用
jQuery验证控件jquery.validate.js使用说明+中文API 官网地址:http://bassistance.de/jquery-plugins/jquery-plugin-valid ...
- jquery.validate.js表单验证
一.用前必备官方网站:http://bassistance.de/jquery-plugins/jquery-plugin-validation/ API: http://jquery.bassist ...
随机推荐
- iOS 多线程及其他补充
NSOperation NSOperation是个抽象类,并不具备封装操作的能力,必须使用它的子类 NSInvocationOperation 如果直接执行NSInvocationOperatio ...
- October 6th 2016 Week 41st Thursday
The outer world you see is a reflection of your inner self. 你拥有什么样的内心,你就会看到什么样的世界. And we eventually ...
- Ubuntu自定义服务
1.准备脚本 准备好一个bash服务脚本,包括start|stop|restart等参数,将脚本文件命名为“服务名”,拷贝到/etc/init.d/目录下. 2.添加服务sudo update-rc. ...
- PHP之MVC项目实战
本文主要包括以下内容 类文件自动加载 路径管理 页面跳转 注册自动加载方法 配置文件系统 cookie session 类文件自动加载 在PHP中使用别的类时,需要载入类文件,如果类很多的话,需要重复 ...
- hadoop+javaWeb的开发中遇到包冲突问题(java.lang.VerifyError)
1.HDFS + WEB 项目 报java.lang.VerifyError... 异常 抛异常: Exception in thread "main" java.lang.Ver ...
- sp_who使用
[SQL Server] sp_who, sp_who2和sp_who3 sp_who可以返回如下信息: (可选参数LoginName, 或active代表活动会话数)Spid (系 ...
- wifi 4次握手
转自:http://zhaoxiaobu.blog.51cto.com/878176/407130/ 不管是用WEP加密,还是用WPA,一般如果我们要和AP建立一个连接,要经过两个阶段认证(Authe ...
- vim、gvim加载文件慢
1. strace -f -T -o vim.strace vim 2. vim --startuptime "vim-time.txt" 3. gvim -f
- WCF----Stream对象限制操作
WCF支持Stream操作,尤其对于传递size过大的消息而言,如要考虑传递消息的效率,WCF推荐通过Stream进行操作.然而,WCF Stream操作规定了一些限制,在我们编写相关程序时,需要特别 ...
- 共享内存同行,王明学learn
共享内存同行 一.共享内存概念 共享内存是IPC机制中的一种,它允许两个不相关的进程访问同一段内存, 这是传递数据的一种非常有效的方式. 二.函数学习 这里主要有创建共享内存.映射共享内存.分离共享内 ...