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 相关文章推荐
JavaScript 设计模式 安全沙箱模式
Sep 24 Javascript
jsp js鼠标移动到指定区域显示选项卡离开时隐藏示例
Jun 14 Javascript
Javascript连接多个数组不用concat来解决
Mar 24 Javascript
jquery实现通用版鼠标经过淡入淡出效果
Jun 15 Javascript
confirm的用法示例用于按钮操作时确定是否执行
Jun 19 Javascript
js使用setTimeout实现定时炸弹的方法
Apr 10 Javascript
jquery实现移动端点击图片查看大图特效
Sep 11 Javascript
jQuery EasyUI右键菜单实现关闭标签/选项卡
Oct 10 Javascript
解决option标签selected=&quot;selected&quot;属性失效的问题
Nov 06 Javascript
浅谈React前后端同构防止重复渲染
Jan 05 Javascript
vue数组对象排序的实现代码
Jun 20 Javascript
Node中对非阻塞I/O、事件循环的知识点总结
Jan 05 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
十天学会php之第九天
2006/10/09 PHP
社区(php&amp;&amp;mysql)五
2006/10/09 PHP
PHP 日期加减的类,很不错
2009/10/10 PHP
PHP数组遍历知识汇总(包含遍历方法、数组指针操作函数、数组遍历测速)
2014/07/05 PHP
PHP实现四种基础排序算法的运行时间比较(推荐)
2016/08/11 PHP
thinkPHP简单实现多个子查询语句的方法
2016/12/05 PHP
PHP基于双向链表与排序操作实现的会员排名功能示例
2017/12/26 PHP
jQuery中odd选择器的定义和用法
2014/12/23 Javascript
JQuery EasyUI的使用
2016/02/24 Javascript
Bootstrap实现带暂停功能的轮播组件(推荐)
2016/11/25 Javascript
微信小程序 按钮滑动的实现方法
2017/09/27 Javascript
详解基于vue-cli优化的webpack配置
2017/11/06 Javascript
node内置调试方法总结
2018/02/22 Javascript
手写简单的jQuery雪花飘落效果实例
2018/04/22 jQuery
Vue 组件传值几种常用方法【总结】
2018/05/28 Javascript
layer实现登录弹框,登录成功后关闭弹框并调用父窗口的例子
2019/09/11 Javascript
微信小游戏中three.js离屏画布的示例代码
2020/10/12 Javascript
Python中类的定义、继承及使用对象实例详解
2015/04/30 Python
python设计模式大全
2016/06/27 Python
pytorch: tensor类型的构建与相互转换实例
2018/07/26 Python
Python实现针对json中某个关键字段进行排序操作示例
2018/12/25 Python
Python分析最近大火的网剧《隐秘的角落》
2020/07/02 Python
解决使用Pandas 读取超过65536行的Excel文件问题
2020/11/10 Python
用CSS3写的模仿iPhone中的返回按钮
2015/04/04 HTML / CSS
美国波道夫·古德曼百货官网:Bergdorf Goodman
2017/11/07 全球购物
TCP/IP模型的分界线
2012/12/01 面试题
财务出纳员岗位职责
2013/11/26 职场文书
生物科学专业个人求职信范文
2013/12/05 职场文书
就业推荐表自我鉴定范文
2014/03/21 职场文书
道德大讲堂实施方案
2014/05/14 职场文书
汽修专业自荐信
2014/07/07 职场文书
国际经济与贸易专业求职信
2014/07/10 职场文书
国际会计专业求职信
2014/08/04 职场文书
2016年员工政治思想表现评语
2015/12/02 职场文书
高一作文之暖冬
2019/11/09 职场文书
SqlServer 垂直分表(减少程序改动)
2021/04/16 SQL Server