1 $(function(){ 2 /* 3 #imgLeft 向左移动图标 4 #imgRight 向右移动图标 5 #box 装载图片的容器 6 .animate({left:"向左移动距离(记得加px加引号)"},移动速度); 7 */ 8 $('#imgLeft').click(function(){ 9 $('#box').animate({left:"0px"},1000); 10 $('#imgRight').attr("src","Iamges/right.png"); 11 $('#imgLeft').attr("src","Iamges/left2.png"); 12 }) 13 $('#imgRight').click(function(){ 14 $('#box').animate({left:"-964px"},1000); 15 $('#imgRight').attr("src","Iamges/right2.png"); 16 $('#imgLeft').attr("src","Iamges/left.png"); 17 }) 18 })
#middle //装载图片容器的div
{
position: relative;
967px;
height: 417px;
margin: 0 auto;
overflow:hidden; //记得要把超出的宽度隐藏起来
}
#box{
1934px;
height:417px;
position:absolute; //要把容器设为absolute
top:0px;
left:0px;
}
#box .page{
float:left; //将图片向左浮动
967px;
height:417px;
border:none;
}
详细点的,可以参考http://www.cnblogs.com/wenson/p/3341074.html