jquery实现图片显示上下左右翻滚

这两天要么不是折腾shopex,要么弄discuz,咱的jquery博客有点忽视了。

白天公司的事情，晚上家里事情也多。

惆怅，时间不够用。

公司的需求像苍蝇似的，一会飞一个，鸡毛蒜皮多如毛。

最近弄商城个人中心相册，看了不少东西，还是老外的做的好。

今天分享一个早上整的jquery实现图片显示上下左右翻滚。

大体思路是这样的，鼠标移动到图片上图片上去，显示另外一个，实现上下 左右显隐效果。

其实是一张图片利用animate

(*^__^*) 嘻嘻……

$(document).ready(function(){

$(".top div a").hover(function(){

$("img",this).stop().animate({top:"-56px"},{queue:false,duration:200});

},function(){

$("img",this).stop().animate({top:"0px"},{queue:false,duration:200});

});

$(".bottom div a").hover(function(){

$("img",this).stop().animate({left:"-122px"},{queue:false,duration:200});

},function(){

$("img",this).stop().animate({left:"0px"},{queue:false,duration:200});

});

})

在线效果DEMO

转自 jquery http://www.jqueryba.com/399.html