轮播图实现效果见下图，图片能自己轮播，点击左右按钮进行翻页轮播，鼠标悬停图片或者标题上，停止轮播； 效果图为： 复制代码 代码如下: 带左右箭头图片轮播 <BR><!--<BR>.rollBox{width:770px;height:260px;overflow:hidden;padding:10px;margin:0 auto;border:1px solid red;}<BR>.rollBox .LeftBotton{height:40px;width:21px;background:url(images/sl.png) no-repeat 0px 5px;overflow:hidden;float:left;display:inline;margin:110px 0 0 0;cursor:pointer;}<BR>.rollBox .RightBotton{height:40px;width:21px;background:url(images/sr.png) no-repeat 0px 5px;overflow:hidden;float:left;display:inline;margin:110px 0 0 0;cursor:pointer;}<BR>.rollBox .Cont{width:726px;overflow:hidden;float:left;}<BR>.rollBox .ScrCont{width:10000000px;}<BR>.rollBox .Cont .pic{width:242px;float:left;text-align:center;}<BR>.rollBox .Cont .pic img{padding:9px;background:#fff;border:1px solid #ccc;display:block;margin:0 auto;width:190px;height:190px;}<BR>.rollBox .Cont .pic div{line-height:20px;color:#505050;margin:15px 0px;}<BR>.rollBox .Cont .pic div span{display:block;}<BR>.rollBox .Cont a:link,.rollBox .Cont a:visited{color:#626466;text-decoration:none;}<BR>.rollBox .Cont a:hover{color:#f00;text-decoration:underline;}<BR>.rollBox #List1,.rollBox #List2{float:left;}<BR>--><BR> 酷站代码-特效1 45446547 酷站代码-特效1 45446547 酷站代码-特效1 45446547 酷站代码-特效1 45446547 酷站代码-特效1 45446547 酷站代码-特效1 45446547 酷站代码-特效1 45446547 酷站代码-特效1 45446547 <BR><!--//--><![CDATA[//><!--<BR>//图片滚动列表 jb51.net<BR>var Speed = 1; //速度(毫秒)<BR>var Space = 5; //每次移动(px)<BR>var PageWidth = 726; //翻页宽度<BR>var fill = 0; //整体移位<BR>var MoveLock = false;<BR>var MoveTimeObj;<BR>var Comp = 0;<BR>var AutoPlayObj = null;<BR>GetObj("List2").innerHTML = GetObj("List1").innerHTML;<BR>GetObj('ISL_Cont').scrollLeft = fill;<BR>GetObj("ISL_Cont").onmouseover = function(){clearInterval(AutoPlayObj);}<BR>GetObj("ISL_Cont").onmouseout = function(){AutoPlay();}<BR>AutoPlay();<BR>function GetObj(objName){if(document.getElementById){return eval('document.getElementById("'+objName+'")')}else{return eval('document.all.'+objName)}}<BR>function AutoPlay(){ //自动滚动<BR> clearInterval(AutoPlayObj);<BR> AutoPlayObj = setInterval('ISL_GoDown();ISL_StopDown();',3000); //间隔时间<BR>}<BR>function ISL_GoUp(){ //上翻开始<BR> if(MoveLock) return;<BR> clearInterval(AutoPlayObj);<BR> MoveLock = true;<BR> MoveTimeObj = setInterval('ISL_ScrUp();',Speed);<BR>}<BR>function ISL_StopUp(){ //上翻停止<BR> clearInterval(MoveTimeObj);<BR> if(GetObj('ISL_Cont').scrollLeft % PageWidth - fill != 0){<BR> Comp = fill - (GetObj('ISL_Cont').scrollLeft % PageWidth);<BR> CompScr();<BR> }else{<BR> MoveLock = false;<BR> }<BR> AutoPlay();<BR>}<BR>function ISL_ScrUp(){ //上翻动作<BR> if(GetObj('ISL_Cont').scrollLeft <= 0){GetObj('ISL_Cont').scrollLeft = GetObj('ISL_Cont').scrollLeft + GetObj('List1').offsetWidth}<BR> GetObj('ISL_Cont').scrollLeft -= Space ;<BR>}<BR>function ISL_GoDown(){ //下翻<BR> clearInterval(MoveTimeObj);<BR> if(MoveLock) return;<BR> clearInterval(AutoPlayObj);<BR> MoveLock = true;<BR> ISL_ScrDown();<BR> MoveTimeObj = setInterval('ISL_ScrDown()',Speed);<BR>}<BR>function ISL_StopDown(){ //下翻停止<BR> clearInterval(MoveTimeObj);<BR> if(GetObj('ISL_Cont').scrollLeft % PageWidth - fill != 0 ){<BR> Comp = PageWidth - GetObj('ISL_Cont').scrollLeft % PageWidth + fill;<BR> CompScr();<BR> }else{<BR> MoveLock = false;<BR> }<BR> AutoPlay();<BR>}<BR>function ISL_ScrDown(){ //下翻动作<BR> if(GetObj('ISL_Cont').scrollLeft >= GetObj('List1').scrollWidth){GetObj('ISL_Cont').scrollLeft = GetObj('ISL_Cont').scrollLeft - GetObj('List1').scrollWidth;}<BR> GetObj('ISL_Cont').scrollLeft += Space ;<BR>}<BR>function CompScr(){<BR> var num;<BR> if(Comp == 0){MoveLock = false;return;}<BR> if(Comp < 0){ //上翻<BR> if(Comp < -Space){<BR> Comp += Space;<BR> num = Space;<BR> }else{<BR> num = -Comp;<BR> Comp = 0;<BR> }<BR> GetObj('ISL_Cont').scrollLeft -= num;<BR> setTimeout('CompScr()',Speed);<BR> }else{ //下翻<BR> if(Comp > Space){<BR> Comp -= Space;<BR> num = Space;<BR> }else{<BR> num = Comp;<BR> Comp = 0;<BR> }<BR> GetObj('ISL_Cont').scrollLeft += num;<BR> setTimeout('CompScr()',Speed);<BR> }<BR>}<BR>//--><!]]><BR>
