JQuery实现鼠标移动图片显示描述层的方法


Posted in Javascript onJune 25, 2015

本文实例讲述了JQuery实现鼠标移动图片显示描述层的方法。分享给大家供大家参考。具体如下:

这里可结合 JQuery easing 的动画来配合使用。

主要代码如下:

$(".item").hover(
function()
{
//$(this).children("img").stop().animate({opacity: 0.8}, 700, "easeInSine");
$(this).children("div.title").stop().animate({top: 0}, 700, "easeOutBounce");
$(this).children("div.desc").stop().animate({bottom: 0}, 700, "easeOutBounce");
},
function(){
//$(this).children("img").stop().animate({opacity: 1}, 700);
$(this).children("div.title").stop().animate({top: -60}, 500);
$(this).children("div.desc").stop().animate({bottom: -40}, 400);
}
);

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

Javascript 相关文章推荐
jQuery 获取URL的GET参数值的小例子
Apr 18 Javascript
Js放到HTML文件中的哪个位置有什么区别
Aug 21 Javascript
ECMAScript5中的对象存取器属性:getter和setter介绍
Dec 08 Javascript
jquery实现倒计时效果
Dec 14 Javascript
阿里巴巴技术文章分享 Javascript继承机制的实现
Jan 14 Javascript
原生JavaScript实现滚动条效果
Mar 24 Javascript
Vuex之理解Mutations的用法实例
Apr 19 Javascript
JavaScript数据结构之优先队列与循环队列实例详解
Oct 27 Javascript
layer.close()关闭进度条和Iframe窗的方法
Aug 17 Javascript
浅谈HTTP 缓存的那些事儿
Oct 17 Javascript
vue基本使用--refs获取组件或元素的实例
Nov 07 Javascript
vue 中this.$set 动态绑定数据的案例讲解
Jan 29 Vue.js
Node.js中的process.nextTick使用实例
Jun 25 #Javascript
Ajax中解析Json的两种方法对比分析
Jun 25 #Javascript
新手快速学习JavaScript免费教程资源汇总
Jun 25 #Javascript
JavaScript中字符串(string)转json的2种方法
Jun 25 #Javascript
深入理解JavaScript编程中的原型概念
Jun 25 #Javascript
Backbone.js 0.9.2 源码注释中文翻译版
Jun 25 #Javascript
在JavaScript应用中实现延迟加载的方法
Jun 25 #Javascript
You might like
php构造函数的继承方法
2015/02/09 PHP
简单解析PHP程序的运行流程
2016/06/23 PHP
浅谈PHP的反射机制
2016/12/15 PHP
从阿里妈妈发现的几个不错的表单验证函数
2007/09/21 Javascript
jQuery 可以拖动的div实现代码 脚本之家修正版
2009/06/26 Javascript
使用JavaScript修改浏览器URL地址栏的实现代码
2013/10/21 Javascript
原生js和jquery中有关透明度设置的相关问题
2014/01/08 Javascript
js进行表单验证实例分析
2015/02/10 Javascript
通用无限极下拉菜单的实现代码
2016/05/31 Javascript
微信js-sdk预览图片接口及从拍照或手机相册中选图接口用法示例
2016/10/13 Javascript
Bootstrap复选框和单选按钮美化插件(推荐)
2016/11/23 Javascript
js实现的xml对象转json功能示例
2016/12/24 Javascript
jQuery中的on与bind绑定事件区别实例详解
2017/02/28 Javascript
VueJS事件处理器v-on的使用方法
2017/09/27 Javascript
JS的函数调用栈stack size的计算方法
2018/06/24 Javascript
JS实现DOM节点插入操作之子节点与兄弟节点插入操作示例
2018/07/30 Javascript
微信小程序 网络通信实现详解
2019/07/23 Javascript
vue下使用nginx刷新页面404的问题解决
2019/08/02 Javascript
python中的实例方法、静态方法、类方法、类变量和实例变量浅析
2014/04/26 Python
用Python制作简单的朴素基数估计器的教程
2015/04/01 Python
C#返回当前系统所有可用驱动器符号的方法
2015/04/18 Python
关于python写入文件自动换行的问题
2018/06/23 Python
五款漂亮的纯CSS3动画按钮的实例教程
2014/11/21 HTML / CSS
用canvas做一个DVD待机动画的实现代码
2019/04/12 HTML / CSS
泰国第一在线超市:Tops
2021/02/13 全球购物
一些.net面试题
2014/10/06 面试题
介绍一下Python中webbrowser的用法
2013/05/07 面试题
关于人生的感言
2014/01/17 职场文书
社会实践感言
2014/01/25 职场文书
工商管理专业大学生职业生涯规划范文
2014/03/09 职场文书
影视广告专业求职信
2014/09/02 职场文书
个人四风对照检查材料
2014/09/26 职场文书
2015年12.4全国法制宣传日活动总结
2015/03/24 职场文书
同事打架检讨书
2015/05/06 职场文书
法定代表人身份证明书
2015/06/18 职场文书
学校财务管理制度
2015/08/04 职场文书