AutoCAD 3DMAX C语言 Pro/E UG JAVA编程 PHP编程 Maya动画 Matlab应用 Android
Photoshop Word Excel flash VB编程 VC编程 Coreldraw SolidWorks A Designer Unity3D
 首页 > JavaScript

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

51自学网 http://www.wanshiok.com
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实现浮动的侧栏实例  下一篇:Node.js中的process.nextTick使用实例