jquery实现两个图片渐变切换效果的方法


Posted in Javascript onJune 25, 2015

本文实例讲述了jquery实现两个图片渐变切换效果的方法。分享给大家供大家参考。具体如下:

这段代码演示了jquery如何实现两个图片渐变切换的效果,为id=kitten的div设置一个背景图片,通过jquery对div进行淡入淡出实现两个图片的渐变切换

html代码

<div id="kitten">
  <img src="/images/kitten.jpg" alt="Kitten" />
</div>

jquery代码

$("#kitten").hover(function(){
  $(this).find("img").fadeOut();
}, function() {
  $(this).find("img").fadeIn();
});

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

Javascript 相关文章推荐
prototype与jquery下Ajax实现的差别
Sep 13 Javascript
关于全局变量和局部变量的那些事
Jan 11 Javascript
JQuery实现Ajax加载图片的方法
Dec 24 Javascript
JavaScript操作HTML DOM节点的基础教程
Mar 11 Javascript
JavaScript学习笔记之数组求和方法
Mar 23 Javascript
javascript运算符——位运算符全面介绍
Jul 14 Javascript
微信小程序 loading 详解及实例代码
Nov 09 Javascript
详解vue+css3做交互特效的方法
Nov 20 Javascript
angular2 ng2-file-upload上传示例代码
Aug 23 Javascript
小程序实现按下录音松开识别语音
Nov 22 Javascript
vue 如何从单页应用改造成多页应用
Oct 23 Javascript
JS常用跨域方法实现原理解析
Dec 09 Javascript
jQuery实现按钮的点击 全选/反选 单选框/复选框 文本框 表单验证
Jun 25 #Javascript
jquery实现带缩略图的全屏图片画廊效果实例
Jun 25 #Javascript
javascript实现跨域的方法汇总
Jun 25 #Javascript
浅谈JavaScript字符串拼接
Jun 25 #Javascript
javascript最基本的函数汇总
Jun 25 #Javascript
使用javascript将时间转换成今天,昨天,前天等格式
Jun 25 #Javascript
javascript中的Function.prototye.bind
Jun 25 #Javascript
You might like
Discuz!X中SESSION机制实例详解
2015/09/23 PHP
PHP框架性能测试报告
2016/05/08 PHP
php使用PDO从数据库表中读取数据的实现方法(必看)
2017/06/02 PHP
PHP实现生成模糊图片的方法示例
2017/12/21 PHP
为jquery.ui.dialog 增加“在当前鼠标位置打开”的功能
2009/11/24 Javascript
jQuery+css实现百度百科的页面导航效果
2014/12/16 Javascript
JS实现从表格中动态删除指定行的方法
2015/03/31 Javascript
jquery实现模拟百分比进度条渐变效果代码
2015/10/29 Javascript
jquery+json实现分页效果
2016/03/07 Javascript
js的form表单提交url传参数(包含+等特殊字符)的两种解决方法
2016/05/25 Javascript
漫谈JS引擎的运行机制 你应该知道什么
2016/06/15 Javascript
Vue中正确使用jQuery的方法
2017/10/30 jQuery
vue.js项目打包上线的图文教程
2017/11/16 Javascript
微信小程序开发之自定义tabBar的实现
2018/09/06 Javascript
vue中的router-view组件的使用教程
2018/10/23 Javascript
[01:17]Ti4 循环赛第一日回顾
2014/07/11 DOTA
Python简单读取json文件功能示例
2017/11/30 Python
Python绘制七段数码管实例代码
2017/12/20 Python
Python实现时钟显示效果思路详解
2018/04/11 Python
python实现将读入的多维list转为一维list的方法
2018/06/28 Python
python2.7和NLTK安装详细教程
2018/09/19 Python
实例分析python3实现并发访问水平切分表
2018/09/29 Python
对pyqt5多线程正确的开启姿势详解
2019/06/14 Python
使用Python实现正态分布、正态分布采样
2019/11/20 Python
大专毕业生自我鉴定
2013/11/21 职场文书
培训主管的职业生涯规划
2014/03/06 职场文书
文化宣传方案
2014/03/13 职场文书
四风问题对照检查材料整改措施
2014/09/27 职场文书
2014年优秀党员材料
2014/12/18 职场文书
五年级上册复习计划
2015/01/19 职场文书
幼儿园工作总结2015
2015/04/01 职场文书
2015年医药代表工作总结
2015/04/25 职场文书
幼儿园亲子活动感想
2015/08/07 职场文书
企业管理制度设计时要注意的几种“常见病”!
2019/04/19 职场文书
Idea连接MySQL数据库出现中文乱码的问题
2021/04/14 MySQL
vue组件冲突之引用另一个组件出现组件不显示的问题
2022/04/13 Vue.js