jQuery实现的文字hover颜色渐变效果实例


Posted in Javascript onFebruary 20, 2016

本文实例讲述了jQuery实现的文字hover颜色渐变效果。分享给大家供大家参考,具体如下:

<html>
<head>
<script type="text/javascript" src="jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="jquery-ui-1.8.16.custom.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
 $("a").hover(function(){
 $("a").animate({width:"80%",height:"40%",fontSize:"100px"},1600,function(){
 $("a").animate({color:"#FFFFFF"},1600);
 });
 },function(){
 $("a").animate({color:"blue"},1600,function(){
 $("a").animate({width:"100px",height:"20px",fontSize:"14px"},1600);
 });
 });
});
</script>
</head>
<body>
<a href="#" style="width:100px;height:20px;font-size:14px;border:red 1px solid;">我不是淡入淡出</a>
</body>
</html>

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
判断是否安装flash player及当前版本的JS代码
Aug 08 Javascript
jquery给图片添加鼠标经过时的边框效果
Nov 12 Javascript
基于jQuery创建鼠标悬停效果的方法
Mar 07 Javascript
使用Angular.js开发的注意事项
Oct 19 Javascript
JS实现的tab切换选项卡效果示例
Feb 28 Javascript
详解Node.js项目APM监控之New Relic
May 12 Javascript
React-router 4 按需加载的实现方式及原理详解
May 25 Javascript
关于JavaScript的单双引号嵌套问题
Aug 20 Javascript
jquery select插件异步实时搜索实例代码
Oct 20 jQuery
jQuery实现table表格信息的展开和缩小功能示例
Jul 21 jQuery
详解Vue CLI 3.0脚手架如何mock数据
Nov 23 Javascript
jQuery实现的自定义轮播图功能详解
Dec 28 jQuery
jQuery+PHP+MySQL实现无限级联下拉框效果
Feb 19 #Javascript
js面向对象的写法
Feb 19 #Javascript
使用jQuery的easydrag插件实现可拖动的DIV弹出框
Feb 19 #Javascript
js下将金额数字每三位一逗号分隔
Feb 19 #Javascript
javascript下使用Promise封装FileReader
Feb 19 #Javascript
javascript每日必学之循环
Feb 19 #Javascript
jQuery实现简单的DIV拖动效果
Feb 19 #Javascript
You might like
php 常用字符串函数总结
2008/03/15 PHP
解析wamp5下虚拟机配置文档
2013/06/27 PHP
php post大量数据时发现数据丢失问题解决方法
2015/06/20 PHP
PHP+swoole实现简单多人在线聊天群发
2016/01/19 PHP
php session的锁和并发
2016/01/22 PHP
php生成mysql的数据字典
2016/07/07 PHP
php版微信公众平台回复中文出现乱码问题的解决方法
2016/09/22 PHP
浅谈PHP中的面向对象OOP中的魔术方法
2017/06/12 PHP
浅谈PHP发送HTTP请求的几种方式
2017/07/25 PHP
PHP输出Excel PHPExcel的方法
2018/07/26 PHP
IE Firefox 使用自定义标签的区别
2009/10/15 Javascript
jQuery判断元素是否存在的可靠方法
2014/05/06 Javascript
用JavaScript来美化HTML的select标签的下拉列表效果
2015/11/17 Javascript
JavaScript代码判断点击第几个按钮
2015/12/13 Javascript
JQuery 动态生成Table表格实例代码
2016/12/02 Javascript
微信小程序 本地数据存储实例详解
2017/04/13 Javascript
JavaScript实现三级级联特效
2017/11/05 Javascript
ES6 系列之 Generator 的自动执行的方法示例
2018/10/19 Javascript
详解Vue 匿名、具名和作用域插槽的使用方法
2019/04/22 Javascript
tsconfig.json配置详解
2019/05/17 Javascript
ES6的异步终极解决方案分享
2019/07/11 Javascript
Python和Ruby中each循环引用变量问题(一个隐秘BUG?)
2014/06/04 Python
Python使用matplotlib填充图形指定区域代码示例
2018/01/16 Python
Python利用sqlacodegen自动生成ORM实体类示例
2019/06/04 Python
python yield和Generator函数用法详解
2020/02/10 Python
python能自学吗
2020/06/18 Python
俄罗斯购买剧院和演唱会门票网站:Parter.ru
2019/11/09 全球购物
美国相机和电子产品零售商:Beach Camera
2020/11/26 全球购物
动态密码技术
2012/10/18 面试题
《桃花心木》教学反思
2014/02/17 职场文书
绘画专业自荐信范文
2014/02/23 职场文书
团日活动总结范文
2014/04/25 职场文书
2014年幼儿园园长工作总结
2014/12/17 职场文书
求职推荐信范文
2015/03/27 职场文书
2016党员党章学习心得体会
2016/01/14 职场文书
MySQL 使用索引扫描进行排序
2021/06/20 MySQL