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 相关文章推荐
HTML5附件拖拽上传drop &amp; google.gears实现代码
Apr 28 Javascript
JS中window.open全屏命令解析及使用示例
Dec 11 Javascript
禁止拷贝网页内容的js代码
Jan 22 Javascript
百度地图给map添加右键菜单(判断是否为marker)
Mar 04 Javascript
AngularJS实现的根据数量与单价计算总价功能示例
Dec 26 Javascript
Vue+webpack+Element 兼容问题总结(小结)
Aug 16 Javascript
swiper.js插件实现pc端文本上下滑动功能示例
Dec 03 Javascript
JavaScript学习笔记之图片库案例分析
Jan 08 Javascript
小程序:授权、登录、session_key、unionId的详解
May 15 Javascript
解决layui页面按钮点击无反应,也不报错的问题
Sep 29 Javascript
利用 JavaScript 实现并发控制的示例代码
Dec 31 Javascript
vue-element-admin项目导入和导出的实现
May 21 Vue.js
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中利用post传递字符串重定向的实现代码
2011/04/21 PHP
PHP利用REFERER根居访问来地址进行页面跳转
2013/09/28 PHP
PHP获取时间排除周六、周日的两个方法
2014/06/30 PHP
php使用curl打开https网站的方法
2015/06/17 PHP
laravel学习教程之关联模型
2016/07/30 PHP
在标题栏显示新消息提示,很多公司项目中用到这个方法
2011/11/04 Javascript
面向对象的Javascript之二(接口实现介绍)
2012/01/27 Javascript
javascript 在firebug调试时用console.log的方法
2012/05/10 Javascript
修改js confirm alert 提示框文字的简单实例
2016/06/10 Javascript
浅析如何利用angular结合translate为项目实现国际化
2016/12/08 Javascript
详解微信小程序 相对定位和绝对定位
2017/05/11 Javascript
基于vue+ bootstrap实现图片上传图片展示功能
2017/05/17 Javascript
gulp解决跨域的配置文件问题
2017/06/08 Javascript
微信小程序canvas写字板效果及实例
2017/06/15 Javascript
vue绑定设置属性的多种方式(5)
2017/08/16 Javascript
vue 全选与反选的实现方法(无Bug 新手看过来)
2018/02/09 Javascript
javascript实现文件拖拽事件
2018/03/29 Javascript
Node.js中读取TXT文件内容fs.readFile()用法
2018/10/10 Javascript
Vue 实现v-for循环的时候更改 class的样式名称
2020/07/17 Javascript
讲解python参数和作用域的使用
2013/11/01 Python
Python性能优化的20条建议
2014/10/25 Python
Python比较两个图片相似度的方法
2015/03/13 Python
python获取图片颜色信息的方法
2015/03/18 Python
Python的gevent框架的入门教程
2015/04/29 Python
详解pandas安装若干异常及解决方案总结
2019/01/10 Python
详解Django-restframework 之频率源码分析
2019/02/27 Python
pyqt5实现登录界面的模板
2020/05/30 Python
linux mint中搜狗输入法导致pycharm卡死的问题
2020/10/28 Python
美国猫狗药物和用品网站:PetCareRx
2017/01/05 全球购物
十八大闭幕感言
2014/01/22 职场文书
团队口号大全
2014/06/06 职场文书
2014年教师批评与自我批评思想汇报
2014/09/20 职场文书
法院执行局工作总结
2015/08/11 职场文书
2016高一新生军训心得体会
2016/01/11 职场文书
Nginx实现高可用集群构建(Keepalived+Haproxy+Nginx)
2021/05/27 Servers
Redis可视化客户端小结
2021/06/10 Redis