JS控制对象移动效果

活动的展示窗

#box{width:500px;height:120px;border:#00FF00 10px ridge;overflow:hidden}
.bigbox{overflow:hidden;}
.smallbox{width:auto!important width:140px;min-width:140px;height:100px;border:#FFFF00 8px ridge;float:left;display:inline;overflow:visible;}

var box,scrollIndex=0,sbArr=new Array();
function $(id){return document.getElementById(id)}
window.onload=function(){
box=$("box");
var bb=box.firstChild;
var tmp=bb.getElementsByTagName("div");
var allWidth=0;
for (var n=0;nheight) height=sbArr[n].offsetHeight;
}
o.style.width=width+"px";
o.style.height=height+"px";
}
function goPrevious(){
if (--scrollIndex=box.scrollWidth-box.clientWidth){
moveBox(box.scrollWidth-box.clientWidth);
if (box.scrollLeft!=box.scrollWidth-box.clientWidth) ++scrollIndex;
}else{
if (++scrollIndex>sbArr.length-1) scrollIndex=sbArr.length-1;
moveBox(sbArr[scrollIndex].scrollFlag);
}
}
function moveBox(scrollFlag){
clearTimeout(box.getAttribute("ta"));
if (Math.abs(scrollFlag-box.scrollLeft)0?0.5:-0.5;
box.scrollLeft=box.scrollLeft+ta;
box.setAttribute("ta",setTimeout(function(){moveBox(scrollFlag)},10));
}
}

content1

content2

content3

content4

content5

content6

content7

content8

content9

左移
右移

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]