[JS]使用js开发滚动字幕-v2增加悬停功能

公司内部的js库和jquery冲突，只能自己写了

 

//////////////////////////动态滚动效果开始//////////////////// var _marqueeboxs = [document.getElementById("marqueebox1"),document.getElementById("marqueebox2")] var rollintervalindexs=[1,2];//动画函数定时器ID组 var rollintervalindex;//动画函数定时器ID var _begin = [true,true];//标记是否启动第一次循环 var task = [1,2]; var lastHeight = [0,0]; var heightoffirstdiv;//滚动片首个元素的行高 function initrolltext(i){ _marqueebox = _marqueeboxs[i]; task[i] = window.setInterval("rolltext("+i+")",5000); } //实现滚动片不断头部去除放到尾部的函数 function rolltext(i){ var _marqueeboxElements = _marqueeboxs[i].getElementsByTagName("li"); var nextLine= _marqueeboxElements[0];//取首元素 if(!_begin[i] || lastHeight[i] == heightoffirstdiv){ _marqueeboxs[i].removeChild(nextLine);//删除第一个子节点 _marqueeboxs[i].appendChild(nextLine);//增加一个子节点到末尾 lastHeight[i] = 0; } _marqueeboxs[i].scrollTop=lastHeight[i];//滚动div的高度偏移量永远定位，表示在首位 _begin[i] = false;//以后的循环已经不再是第一次的启动循环 heightoffirstdiv = _marqueeboxElements[0].offsetHeight * 1.5 - 6;//当前移动的偏移量 clearInterval(rollintervalindexs[i]); rollintervalindexs[i]=setInterval("scrollMarquee("+heightoffirstdiv+","+i+")",20); //以20毫秒速度执行，速度非常快 } //模拟动画的函数 function scrollMarquee(heightoffirstdiv,i) { _marqueeboxs[i].scrollTop++; //网上滚动一个行距 // 弥补高度 lastHeight[i] = _marqueeboxs[i].scrollTop; if(_marqueeboxs[i].scrollTop == heightoffirstdiv){ clearInterval(rollintervalindexs[i]);//停止滚动任务 } } function stopRoll(i){ clearInterval(rollintervalindexs[i]);//停止滚动任务 clearInterval(task[i]); } function continuedRoll(i){ _begin[i] = true; task[i] = window.setInterval("rolltext("+i+")",5000); } //////////////////////////动态滚动效果结束//////////////////// 

 

window.setTimeout("initrolltext(0)",3000); window.setTimeout("initrolltext(1)",3000);