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