[Jquery]滑动门效果
$(function(){
var $box=$("#box");
var $img=$box.find("img");
var imgWidth=$img.eq(0).width();
var exposeWidth=160;
var boxWidth=imgWidth+exposeWidth*($img.length-1);
var translate=imgWidth-exposeWidth;
$box.width(boxWidth);
$img.not($img.eq(0)).each(function(i){ //i从0开始
var left=imgWidth+i*exposeWidth;
$(this).css("left",left);
$(this).data("pos",left); //向pos元素附加数据left
});
$img.each(function(i){
$(this).mouseover(function(){
//开门
for(var j=1;j<=i;j++){
var $imgs=$img.eq(j);
$imgs.animate({"left":$imgs.data("pos")-translate},200); //从pos元素取得初始位置
}
//关门
for(var j=i+1,len=$img.length;j<len;j++){
var $imgs=$img.eq(j);
$imgs.animate({"left":$imgs.data("pos")},200);
}
});
});
});
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
