不间断滚动代码,可支持N多个同时滚动

效果可见 scroll.html

11111111111111
22222222222222
33333333333333
44444444444444
55555555555555

a11111111111111
a22222222222222
a33333333333333
a44444444444444
a55555555555555

b11111111111111
b22222222222222
b33333333333333
b44444444444444
b55555555555555

c11111111111111
c22222222222222
c33333333333333
c44444444444444
c55555555555555

<div id="marquees"><!-- 这些是字幕的内容，你可以任意定义 -->11111111111111<br />22222222222222<br />33333333333333<br />44444444444444

<br />55555555555555<br /><!-- 字幕内容结束 --></div>
<br />
<div id="marquees1">a11111111111111<br />

a22222222222222<br />a33333333333333<br />

a44444444444444<br />a55555555555555<br /></div>
<br />
<div id="marquees2">b11111111111111<br />b22222222222222

<br />b33333333333333<br />b44444444444444<br />b55555555555555<br /></div>
<br />
<div id="marquees3">c11111111111111<br />c22222222222222

<br />c33333333333333<br />c44444444444444<br />c55555555555555<br /></div>
<SCRIPT language=javascript>
<!--

/**
* Scroll js 不间断滚动代码,可支持N多个同时滚动 :)  test QQ:632519  web:ynjob.net 改进于网上共享代码
*
* @param string ClassName 当前new 生成的类名 不清楚jsp能否有函数得到该名称.目录只能用传递参数来解决,很是别扭
* @param string divObj  div id="编号"  指定这里的编号 字符
* @param int marqueesHeight 内容区高度
* @param int timeToScroll 设定多少时间滚动一次  
* @param int pixelToScroll 每次滚动条向下移动几个像素 与以上参数一样控制滚动速度
* Exp:  var tmpObj=new Scroll("tmpObj",marquees,50,20,1);
* 2006-4-20 14:38
* @version 1.0.0
*/

function Scroll(ClassName,divObj,marqueesHeight,timeToScroll,pixelToScroll)
{
 this.mOjb    = divObj;    //指定要滚动的对像
 this.mBlStopScroll  = false;    //这个变量控制是否停止滚动
 this.mPreTop   = 0;     //这个变量用于判断滚动条是否已经到了尽头

 this.mTimeToScroll  = timeToScroll;  //设定多少时间滚动一次
 this.mMarqueesHeight = marqueesHeight;  //内容区高度

 this.mTemplayer   = null;    //不可见的层的ID名字
 this.mClassName   = ClassName;   //当前new 生成的类名
 this.mPixelToScroll  = pixelToScroll;  //每次滚动条向下移动几个像素

 this.SetStop = function(isScrolled)//设定是否滚动
 {
  this.mBlStopScroll=isScrolled;
 }
 
 this.start = function()       //开始运行
 {
  with(this.mOjb)
  {
   noWrap=true; //这句表内容区不自动换行
   style.width=0; //于是我们可以将它的宽度设为0，因为它会被撑大
   style.height=this.mMarqueesHeight;
   style.overflowY="hidden"; //滚动条不可见 hidden scroll
   οnmοuseοver=new Function(this.mClassName+".SetStop(true)"); //鼠标经过，停止滚动
   οnmοuseοut=new Function(this.mClassName+".SetStop(false)"); //鼠标离开，开始滚动
  }
  var tmp_id ="templayer"+this.mClassName;
  //这时候，内容区的高度是无法读取了。下面输出一个不可见的层"templayer"，稍后将内容复制到里面：让每次生成div ID都不一样.防止冲突
  document.write('<div id="'+tmp_id+'" style="position:absolute;z-index:1;visibility:hidden"></div>');
  this.mTemplayer=document.getElementById(tmp_id);  //将得到随机生成的mTemplayer对像 并保存
  this.init();
 }

 
 this.init = function()//初始化滚动内容
 {
/*  alert(this.mTemplayer.offsetHeight+":"+this.mMarqueesHeight);
  this.mTemplayer.innerHTML+=this.mOjb.innerHTML;
  alert(this.mTemplayer.offsetHeight+":"+this.mMarqueesHeight);
  this.mTemplayer.innerHTML+=this.mOjb.innerHTML;
  alert(this.mTemplayer.offsetHeight+":"+this.mMarqueesHeight);
*/
  var tmp_height = this.mTemplayer.offsetHeight;
  //多次复制原内容到"templayer"，直到"templayer"的高度大于内容区高度：
  while(this.mTemplayer.offsetHeight<this.mMarqueesHeight)
  {
   this.mTemplayer.innerHTML+=this.mOjb.innerHTML;
   if(this.mTemplayer.offsetHeight == tmp_height)    //如果高度没变化。直接退出,以防死循环
    break;
  } //把"templayer"的内容的“两倍”复制回原内容区：
  this.mOjb.innerHTML=this.mTemplayer.innerHTML+this.mTemplayer.innerHTML;
 }
 
 this.scrollUp = function(pixelToScroll)//滚动条的驱动函数
 {
  if(this.mBlStopScroll==true) return; //如果变量"stopscroll"为真，则停止滚动
  this.mPreTop=this.mOjb.scrollTop; //记录滚动前的滚动条位置
  this.mOjb.scrollTop+=pixelToScroll; //滚动条向下移动一个像素
  //如果滚动条不动了，则向上滚动到和当前画面一样的位置
  //当然不仅如此，同样还要向下滚动一个像素(+1)：
  if(this.mPreTop==this.mOjb.scrollTop){
  this.mOjb.scrollTop=this.mTemplayer.offsetHeight-this.mMarqueesHeight+1;
  }
 }
 this.start(); //直接启动
 setInterval(this.mClassName+".scrollUp("+this.mPixelToScroll+")",this.mTimeToScroll);
}

//* 以下为调用代码

var tmpObj=new Scroll("tmpObj",marquees,50,50,1);
var tmpObj1=new Scroll("tmpObj1",marquees1,100,100,5);
var tmpObj2=new Scroll("tmpObj2",marquees2,150,150,10);
var tmpObj3=new Scroll("tmpObj3",marquees3,200,1000,200);

//*/
-->
</script>

<script language=javascript> </script>