JQuery实现鼠标移动图片显示描述层的方法
更新时间：2015年06月25日 10:29:27 作者：任意球
这篇文章主要介绍了JQuery实现鼠标移动图片显示描述层的方法,涉及jQuery鼠标事件及动画效果的使用技巧,需要的朋友可以参考下
本文实例讲述了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程序设计有所帮助。
相关文章
最近在学习jquery，今天抽空用jquery写个checkbox——类似邮箱全选功能，感兴趣的你可以参考下哈，希望可以帮助到你2013-03-03
此作品是一款jquery+html5实现的时钟插件clock，效果非常棒，推荐给大家参考下，小伙伴们可以直接拿走使用。2015-04-04
jQuery EasyUI API 中文文档 - Dialog对话框
jQuery EasyUI API 中文文档 - Dialog对话框使用说明，需要的朋友可以参考下。2011-11-11
瀑布流布局在目前貌似很火爆，具体的分析、原理、用到的知识等等可以看看以下几位牛人写的东西2012-10-10
jQuery中操控hidden、disable等无值属性的方法
在实现一些表单提交页面时会放置若干隐藏属性，下面为大家介绍下jQuery中如何操控hidden、disable等无值属性，感兴趣的朋友不要错过2014-01-01
本篇文章主要介绍了jQuery返回定位插件的相关知识，具有很好的参考价值。下面跟着小编一起来看下吧2017-05-05
本篇文章是对文件编码导致jquery失效的解决方法进行了详细的分析介绍，需要的朋友参考下2013-06-06
jQuery实现form表单序列化转换为json对象功能示例
这篇文章主要介绍了jQuery实现form表单序列化转换为json对象功能,结合实例形式分析了表单数据传输中使用serializeJson进行序列化操作相关实现技巧,需要的朋友可以参考下2018-05-05
显示隐藏效果的实现主要是jquery层选择器的应用：当鼠标移动经过照片就显示设为封面删除，移开后就隐藏，此效果在web开发中经常会用到，感兴趣的朋友可以参考下哈2013-03-03
取得id为form1的form的所有输入变量，然后使用for循环进行数组遍历，具体实现如下，感兴趣的朋友可以参考下2013-09-09
最新评论