JS控制对象移动效果 时间:2020-05-12 人气:0 活动的展示窗 <script language="javascript" type="text/javascript"> 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<0) scrollIndex=0; moveBox(sbArr[scrollIndex].scrollFlag); } function goNext(){ if (sbArr[scrollIndex+1].scrollFlag>=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)<1){ box.scrollLeft=scrollFlag; }else{ var ta=parseInt((scrollFlag-box.scrollLeft)/8+1); if (Math.abs(ta)<0.5) ta=ta>0?0.5:-0.5; box.scrollLeft=box.scrollLeft+ta; box.setAttribute("ta",setTimeout(function(){moveBox(scrollFlag)},10)); } } </script> content1 content2 content3 content4 content5 content6 content7 content8 content9 左移 右移 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 加载全部内容