连续滚动图片【兼容FF】100分 修改一下就OK

<div id="demo" style="overflow:hidden;height:129px;width:500px;color:#ffffff">
<table align="left" cellpadding="0" cellspace="0" border="0">
<tr>
<td id="demo1" valign="top"><img src="http://www.baidu.com/img/baidu_logo.gif"><img src="http://www.baidu.com/img/baidu_logo.gif"><img src="http://www.baidu.com/img/baidu_logo.gif"><img src="http://www.baidu.com/img/baidu_logo.gif"><img src="http://www.baidu.com/img/baidu_logo.gif"><img src="http://www.baidu.com/img/baidu_logo.gif">
</td>
<td id="demo2" valign="top"></td>
</tr>
</table>
</div><script type="text/javascript">
var speed=30
demo2.innerHTML=demo1.innerHTML
function Marquee(){
if(demo2.offsetWidth-demo.scrollLeft<=0)
demo.scrollLeft-=demo1.offsetWidth
else{
demo.scrollLeft++
}
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
</script> 
在FF里不可以，哪儿修改下！！

解决方案 »

  1.   

    不要说去掉<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
      

  2.   

    <script type="text/javascript"> 
    var speed=30 
    var demo = document.getElementById("demo");
    var demo1 = document.getElementById("demo1");
    var demo2 = document.getElementById("demo2");
    demo2.innerHTML=demo1.innerHTML 
    function Marquee(){ 
    if(demo2.offsetWidth-demo.scrollLeft <=0) 
    demo.scrollLeft-=demo1.offsetWidth 
    else{ 
    demo.scrollLeft++ 
    } 
    } 
    var MyMar=setInterval(Marquee,speed) 
    demo.onmouseover=function() {clearInterval(MyMar)} 
    demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)} 
    </script>
      

  3.   

    <html>
    <head>
    <style type="text/css">
    #demo1{
    position:relative;
    width:694px;
    height:160px;
    overflow:hidden;
    white-space:nowrap;
    }
    #demo1 div{
    position:absolute;
    }
    </style>
    </head>
    <body>
    <div id="demo1" valign="top"><div><img src="http://www.baidu.com/img/baidu_logo.gif"><img src="http://www.baidu.com/img/baidu_logo.gif"><img src="http://www.baidu.com/img/baidu_logo.gif"><img src="http://www.baidu.com/img/baidu_logo.gif"><img src="http://www.baidu.com/img/baidu_logo.gif"><img src="http://www.baidu.com/img/baidu_logo.gif"></div></div>
    <script type="text/javascript">
    function setMarquee(){
    var Tim,Div=document.getElementById("demo1").getElementsByTagName("div")[0],Img=Div.getElementsByTagName("img");
    var Child=function(){
    return Div.getElementsByTagName("img")[0];
    }
    var Left=function(s){
    if(s){
    Div.style.left=s+"px";
    }else{
    var s=Div.style.left,r=/^(.+)px$/;
    if(r.test(s)){
    return parseInt(s.replace(r,"$1"));
    }else{
    return 0
    }
    }
    }
    var Distance=function(){
    return -(Child().offsetWidth);
    }
    var Play=function(){
    if(Tim)clearTimeout(Tim);
    var l=Left();
    if(Distance()<l){
    Left(l-1);
    Tim=setTimeout(Play,25); //滚动速度
    }else{
    var o=Child();
    Div.removeChild(o);
    Div.appendChild(o);
    Div.style.left=0;
    Tim=setTimeout(Play,500); //滚动间隔
    }
    }
    Tim=setTimeout(Play,1000); //第一次滚动
    for(var i=0;i<Img.length;i++){
    Img[i].onmouseover=function(){
    if(Tim)clearTimeout(Tim);
    }
    Img[i].onmouseout=function(){
    Tim=setTimeout(Play,500); //鼠标离开后滚动间隔
    }
    }
    }
    setMarquee();
    </script> 
    </body>
    </html>
      

  4.   

    <html>
    <head>
    <style type="text/css">
    #demo1{
    position:relative;
    width:694px;
    height:160px;
    overflow:hidden;
    white-space:nowrap;
    }
    #demo1 div{
    position:absolute;
    }
    </style>
    </head>
    <body>
    <div id="demo1" valign="top"><div><a href="#"><img src="http://www.baidu.com/img/baidu_logo.gif"></a><a href="#"><img src="http://www.baidu.com/img/baidu_logo.gif"></a><a href="#"><img src="http://www.baidu.com/img/baidu_logo.gif"></a><a href="#"><img src="http://www.baidu.com/img/baidu_logo.gif"></a><a href="#"><img src="http://www.baidu.com/img/baidu_logo.gif"></a><a href="#"><img src="http://www.baidu.com/img/baidu_logo.gif"></a></div></div>
    <script type="text/javascript">
    function setMarquee(){
    var Tim,Div=document.getElementById("demo1").getElementsByTagName("div")[0],Img=Div.getElementsByTagName("a");
    var Child=function(){
    return Div.getElementsByTagName("a")[0];
    }
    var Left=function(s){
    if(s){
    Div.style.left=s+"px";
    }else{
    var s=Div.style.left,r=/^(.+)px$/;
    if(r.test(s)){
    return parseInt(s.replace(r,"$1"));
    }else{
    return 0
    }
    }
    }
    var Distance=function(){
    return -(Child().offsetWidth);
    }
    var Play=function(){
    if(Tim)clearTimeout(Tim);
    var l=Left();
    if(Distance() <l){
    Left(l-1);
    Tim=setTimeout(Play,25); //滚动速度
    }else{
    var o=Child();
    Div.removeChild(o);
    Div.appendChild(o);
    Div.style.left=0;
    Tim=setTimeout(Play,500); //滚动间隔
    }
    }
    Tim=setTimeout(Play,1000); //第一次滚动
    for(var i=0;i <Img.length;i++){
    Img[i].onmouseover=function(){
    if(Tim)clearTimeout(Tim);
    }
    Img[i].onmouseout=function(){
    Tim=setTimeout(Play,500); //鼠标离开后滚动间隔
    }
    }
    }
    setMarquee();
    </script>
    </body>
    </html>