页面导航：首页 → 网络编程 → JavaScript → 网页特效 → 图象特效 → 正文内容

真正的连续滚动图片

发布：dxy 字体：[增加减小] 类型：转载

点击运行可以看到效果:

<SCRIPT language=JavaScript>                       
function marquee1()                       
{                       
  document.write("<div style='width:100%;overflow:hidden;' id=marquee onmouseover=clearInterval(repeat)  onmouseout=repeat=setInterval(scrollMarquee,1)>")                       
}                       
function marquee2()                       
{                 
  document.write("</div>")    
  marquee.childNodes[0].align='left'; 
  
  if(marquee.childNodes[0].offsetWidth>marquee.offsetWidth) { 
   marquee.appendChild(marquee.childNodes[0].cloneNode(true)); 
   } 
  else { 
   for(var i=0;i<Math.round(marquee.offsetWidth/marquee.childNodes[0].offsetWidth)+1;i++) { 
    marquee.appendChild(marquee.childNodes[0].cloneNode(true)); 
    } 
   } 
  repeat=setInterval(scrollMarquee,1); 
}                       
function scrollMarquee() { 
 if(marquee.scrollLeft<marquee.childNodes[0].offsetWidth) 
  marquee.scrollLeft++; 
 else  
  marquee.scrollLeft=0; 
  }                   
</SCRIPT>

<SCRIPT language=JavaScript>marquee1();</SCRIPT> 
<table width="300" border="0" cellspacing="0" cellpadding="0"> 
<tr>

</tr> 
</table> 
            <SCRIPT language=JavaScript>marquee2(); </SCRIPT>

[Ctrl+A 全选提示:你可先修改部分代码,再按运行]

Tags：真正的连续滚动图片