JS画像シームレススクロール（シンプルで使いやすい）_JavaScriptスキル

そのままコピーしたら、ほとんど修正せずに使えます！ご質問がございましたら、ご相談ください

コードをコピー コードは次のとおりです: 滚アニメーション代 *{ margin:0;パディング:0;} ul,li{ list-style:none;} .left_1{ width:500px;高さ:100ピクセル; margin:0 auto;} .left_1 ul{} .left_1 li{ float:left;幅:120ピクセル;高さ:100ピクセル;行の高さ:100ピクセル; text-align:center;} .left_1 p{ width:50px;彼 100ピクセル; line-height:100px;} .left_1_i div{ width:100px;高さ:100ピクセル;行の高さ:100ピクセル;ボーダー:1px ソリッド #e5e5e5;マージン左:10px; padding-left:10px;} functionscrollSZ(con_id,speed,direct){ var con,items,heightHalf ,heightAll; var timer; speed = parseInt(speed);//获取設置の速度パラメータ con = document.getElementById(con_id); con.style.overflow = "hidden" ; if(direct == "top"){ direct = "top"; }else if(direct == "bottom"){ direct = "bottom"; }else{ direct = "top"; }

con.innerHTML =con.innerHTML; con.innerHTML =con.innerHTML; items = getChildNodes(con) ; if(items.length return; } heightAll = 0; for(var i=0;i var numTop,numBottom; if (!!window.ActiveXObject){ numTop = items[i].currentStyle["marginTop"]; numBottom = items[i].currentStyle["marginBottom "]; }else{ numTop = document.defaultView.getComputedStyle(items[i],null)["marginTop"]; numBottom = document.defaultView.getComputedStyle(items[i],null) )["marginBottom"]; } numTop = parseInt(numTop); numBottom = parseInt(numBottom); numTop = numBottom; if(numTop >0){ heightAll = numTop; } heightAll = items[i].offsetHeight; } heightHalf = heightAll/2; if(direct == "bottom"){ con.scrollTop = heightHalf; timer = setInterval(_scrollBottom,speed); }else if(direct == "top"){ timer = setInterval(_scrollTop,speed); } con.onmouseover = function(){ if(timer){ clearInterval(timer); timer = null; } }; con.onmouseout = function(){ if(!timer){ if(direct == "top"){ timer = setInterval(_scrollTop,speed); }else if(direct == "bottom"){ timer = setInterval(_scrollBottom,speed); }

} }; function _scrollTop(){ if(con.scrollTop con.scrollTop = 2; }else{ con.scrollTop = 0; } } function _scrollBottom(){ if(con.scrollTop > 0){ con.scrollTop -= 2; } else{ con.scrollTop = heightHalf; } } } functionscrollSP(con_id,speed,direct){ var con,innerCon,timer,items,widthAll, widthHalf; speed = parseInt(speed); con = document.getElementById(con_id); con.style.overflow = "hidden"; items = getChildNodes(con); if(items.length == 1){ innerCon = items[0]; }else{ return; } innerCon.innerHTML = innerCon.innerHTML; innerCon .innerHTML = innerCon.innerHTML; items = getChildNodes(innerCon); if(items.length return; } widthAll = 0; for( var i=0;i<items.length;i ){

}

for(var i=0;i var numLeft,numRight ; if (!!window.ActiveXObject){ items[i].style.styleFloat = "left"; numLeft = items[i].currentStyle["marginLeft"]; numRight = items[i].currentStyle["marginRight"]; }else{ items[i].style.cssFloat = "left"; numLeft = document.defaultView.getComputedStyle(items[i] ,null)["marginLeft"]; numRight = document.defaultView.getComputedStyle(items[i],null)["marginRight"]; } numLeft = parseInt(numLeft); numRight = parseInt(numRight); numLeft = numRight; if(numLeft>0){ widthAll = numLeft; } widthAll = items[i].offsetWidth; } widthHalf = widthAll/2; innerCon.style.width = widthAll "px"; if(direct == "left"){ direct = "left"; }else if(direct == "右"){ direct = "右"; }else{ direct = "左" } if(direct == "左"){ timer = setInterval(_scrollLeft,speed); }else if(direct == "right"){ con.scrollLeft = widthHalf; timer = setInterval(_scrollRight,speed); } con.onmouseover = function(){ if(timer){ clearInterval(timer); timer = null; } } con.onmouseout = function(){ if(direct == "left"){ timer = setInterval(_scrollLeft,speed); }else{ timer = setInterval(_scrollRight,speed); } } function _scrollLeft(){

if(con.scrollLeft con.scrollLeft = 2; }else{ con.scrollLeft = 0; } } function _scrollRight(){ if(con.scrollLeft>0){ con.scrollLeft -= 2; }else{ con.scrollLeft = widthHalf; } } } function getChildNodes(obj){//获取元素子节点 var childList,list; childList = new Array() ; list = obj.childNodes; for(var i=0;i if(list[i].nodeType == 1) childList[childList .length] = list[i]; } return childList; } 1

&lt ;p>2

3

4

b scrollSP("left_1",10,"right");