js实现图片自动的滚动效果
自动滚动，主要思路是用js自带的setInterval方法。定义和用法setInterval() 方法可按照指定的周期（以毫秒计）来调用函数或计算表达式。setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。语法setInterval(code,millisec[,"lang"])参数code 必需。要调用的函数或要执行的代码串。 millisec 必须。周期性执行或调用 code 之间的时间间隔，以毫秒计。 返回值一个可以传递给 Window.clearInterval() 从而取消对 code 的周期性执行的值。简单的例子，仅供参考： *{ margin:0; padding:0; list-style:none;} #box{ width:840px; border:1px solid #000; height:210px; margin:30px auto; position:relative; overflow:hidden;} #box ul{ position:absolute; left:0; top:0;} #box ul li{ width:200px; height:200px; float:left; padding:5px;} window.onload=function(){ var oBox=document.getElementById('box'); var oUl=oBox.children[0]; var aLi=oUl.children; //复制一份内容 oUl.innerHTML+=oUl.innerHTML; oUl.style.width=aLi.length*aLi[0].offsetWidth+'px'; setInterval(function(){ var l=oUl.offsetLeft+10; if(l>=0){ l=-oUl.offsetWidth/2; } oUl.style.left=l+'px'; },30); };
怎么用CSS代码实现，好多图片横向的不间断滚动？
你好！CSS实现不了，配合JS才行
代码如下：
<!--
#demo {overflow:hidden;width:740px; }
#indemo { float: left; width: 800%;}
#demo1 { float: left; }
#demo2 { float: left;margin-left:7px;}
-->
<!--
var speed=10; //数字越大速度越慢
var tab=document.getElementById("demo");
var tab1=document.getElementById("demo1");
var tab2=document.getElementById("demo2");
tab2.innerHTML=tab1.innerHTML;
function Marquee(){
if(tab2.offsetWidth-tab.scrollLeft<=0)
tab.scrollLeft-=tab1.offsetWidth
else{
tab.scrollLeft++;
}
}
var MyMar=setInterval(Marquee,speed);
tab.onmouseover=function() {clearInterval(MyMar)};
tab.onmouseout=function() {MyMar=setInterval(Marquee,speed)};
-->
