经测试代码如下：
<html>
<head>
<Meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>滚动板</title>
<style type="text/css">
body { font: 12px/1 "宋体",SimSun,serif; background:#fff; color:#000; }
.scrollUl { overflow:hidden; position:relative; }
#scrollUlTest1 {height:80px;}
#scrollUlTest2 {height:120px;}
.scrollUl ul,.scrollUl li { margin:0; padding:0; list-style:none outside; }
.scrollUl ul { position:absolute; }
.scrollUl li { height:20px; }
</style>
<script type="text/javascript" language="javascript">
// containerId 滚动板外层节点的 ID
// numViews 分几屏滚动，需要滚动显示的总行数应该是分屏数的整倍数。
// showTime 每屏固定住时显示的时间，单位毫秒
// scrollTime 每次滚动一屏用的时间，单位毫秒
var ScrollUl=function(containerId,numViews,showTime,scrollTime) {
//定时器变量，因为有移到层上时停止滚动的事件处理，而那时可能还没开始定时器呢，所以先把这个变量声明出来。
this.timer=null;
this.numViews = numViews;
this.showTime = showTime;
this.scrollTime = scrollTime;
this.container = document.getElementById(containerId);
var ulChild = this.container.getElementsByTagName('ul');
var ul = ulChild[0];
//ul 是未使用 CSS 明确指定高度的，IE 中用 realstyle 取不到高度，只能得到 auto，而 getBoundingClientRect() 是 IE 和 FF 都支持的方式。
var rect = ul.getBoundingClientRect();
var heightAll = rect.bottom - rect.top;
var heightView = heightAll / this.numViews;
var msPerPx = this.scrollTime / heightView;
//复制出一份来，接在原块的后面，用于头接尾的显示
var ulCopy = ul.cloneNode(true);
ulCopy.style.top = heightAll+'px';
this.container.appendChild(ulCopy);
var itself = this;
//向上滚动的函数
var scrollView = function() {
var oldTop = (''==ul.style.top) ? 0: parseInt(ul.style.top) ;
//移动到顶后，把位置复原，两个块继续从 0 开始向上移。
if (oldTop < -heightAll)
{
oldTop = 0;
}
ul.style.top = (oldTop - 1) +'px';
ulCopy.style.top = (oldTop + heightAll- 1) +'px';
//每滚一整屏多停一会。oldTop-1 是为了让其停在整数位置。
var duration = (0 == ((oldTop-1) % heightView)) ? itself.showTime:msPerPx;
itself.timer = setTimeout(scrollView,duration);
};
//把 slide 定义为 prototype 的方法时，似乎这样 setTimeout(itself.slide,itself.showTime); 定时操作不灵，而只能是局部函数才能定时操作，如果带参数，还得封装成匿名函数：
itself.timer = setTimeout(scrollView,itself.showTime);
//鼠标移上时停止滚动
this.container.onmouSEOver = function() {
window.clearTimeout(itself.timer);
};
//鼠标移开时继续滚动，不用区分当时是在整屏停止还是滚动中了，全都按静止时间来延时就得了。
this.container.onmouSEOut = function() {
itself.timer = setTimeout(scrollView,itself.showTime);
};
};
window.onload = function() {
//第一个总共 20 行，每次显示 2行，分 10 屏
var s1 = new ScrollUl('scrollUlTest1',10,2000,1000);
//第二个总共 18 行，每次显示 6 行，分 3 屏
var s2 = new ScrollUl('scrollUlTest2',3,3000,2000);
};
</script>
</head>
<body>
<h1>通用滚动板演示</h1>
<h4>第1组</h4>
<div class="scrollUl" id="scrollUlTest1">
<ul>
<li>第 1 条内容</li>
<li>第 2 条内容</li>
<li>第 3 条内容</li>
<li>第 4 条内容</li>
<li>第 5 条内容</li>
<li>第 6 条内容</li>
<li>第 7 条内容</li>
<li>第 8 条内容</li>
<li>第 9 条内容</li>
<li>第 10 条内容</li>
<li>第 11 条内容</li>
<li>第 12 条内容</li>
<li>第 13 条内容</li>
<li>第 14 条内容</li>
<li>第 15 条内容</li>
<li>第 16 条内容</li>
<li>第 17 条内容</li>
<li>第 18 条内容</li>
<li>第 19 条内容</li>
<li>第 20 条内容</li>
</ul>
</div>
<h4>第2组</h4>
<div class="scrollUl" id="scrollUlTest2">
<ul>
<li>第 1 条内容</li>
<li>第 2 条内容</li>
<li>第 3 条内容</li>
<li>第 4 条内容</li>
<li>第 5 条内容</li>
<li>第 6 条内容</li>
<li>第 7 条内容</li>
<li>第 8 条内容</li>
<li>第 9 条内容</li>
<li>第 10 条内容</li>
<li>第 11 条内容</li>
<li>第 12 条内容</li>
<li>第 13 条内容</li>
<li>第 14 条内容</li>
<li>第 15 条内容</li>
<li>第 16 条内容</li>
<li>第 17 条内容</li>
<li>第 18 条内容</li>
</ul>
</div>
</body>
</html>
<!-- 来自 编程之家 jb51.cc （jb51.cc）-->
<html>
<head>
<Meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery文字无缝滚动效果代码</title>
<style type="text/css">
li{list-style: none;}
.buy-list {height: 100px;overflow: hidden;line-height: 20px;}
</style>
<script src="http://apps.bdimg.com/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
// JavaScript Document
(function($){
$.fn.myScroll = function(options){
//默认配置
var defaults = {
speed:40,//滚动速度,值越大速度越慢
rowHeight:24 //每行的高度
};
var opts = $.extend({},defaults,options),intId = [];
function marquee(obj,step){
obj.find("ul").animate({
marginTop: '-=1'
},function(){
var s = Math.abs(parseInt($(this).css("margin-top")));
if(s >= step){
$(this).find("li").slice(0,1).appendTo($(this));
$(this).css("margin-top",0);
}
});
}
this.each(function(i){
var sh = opts["rowHeight"],speed = opts["speed"],_this = $(this);
intId[i] = setInterval(function(){
if(_this.find("ul").height()<=_this.height()){
clearInterval(intId[i]);
}else{
marquee(_this,sh);
}
},speed);
_this.hover(function(){
clearInterval(intId[i]);
},function(){
intId[i] = setInterval(function(){
if(_this.find("ul").height()<=_this.height()){
clearInterval(intId[i]);
}else{
marquee(_this,sh);
}
},speed);
});
});
}
})(jQuery);
$(document).ready(function(){
$('.buy-list li:even').addClass('lieven');
})
$(function(){
$(".buy-list").myScroll({
speed:200,//数值越大，速度越慢
rowHeight:20 //li的高度
});
});
</script>
</head>
<body>
<div class="buy-list">
<ul>
<li>1、蓝瘦香菇</li>
<li>2、蓝瘦香菇</li>
<li>3、蓝瘦香菇</li>
<li>4、蓝瘦香菇</li>
<li>5、蓝瘦香菇</li>
<li>6、蓝瘦香菇</li>
<li>7、蓝瘦香菇</li>
<li>8、蓝瘦香菇</li>
</ul>
</div>
</body>
</html>
<!-- 来自 编程之家 jb51.cc （jb51.cc）-->
<!DOCTYPE html>
<html >
<head>
<Meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<Meta name="keywords" content="" />
<Meta name="description" content="" />
<title>左右无间断滚动效果</title>
<style type="text/css" media="all">
.d1 {margin:10px auto;width:200px;height:auto;overflow:hidden;white-space:nowrap;}
.d2 {margin:0px auto;background-color:#FF9933;}
.div2 {width:auto;height:auto;font-size:12px;float:left;overflow:hidden;}
ul{margin:0px;padding:9px;list-style:none;line-height:19px;font-size:12px;}
a:link,a:visited{color:#3F78CF;text-decoration:none;}
a:hover{color:#FF00CC;text-decoration:underline;}
</style>
<script language="javascript" type="text/javascript">
var s,s2,s3,s4,timer;
function init(){
s=getid("div1");
s2=getid("div2");
s3=getid("div3");
s4=getid("scroll");
s4.style.width=(s2.offsetWidth*2+100)+"px";
s3.innerHTML=s2.innerHTML;
timer=setInterval(mar,30)
}
function mar(){
if(s2.offsetWidth<=s.scrollLeft){
s.scrollLeft-=s2.offsetWidth;
}else{s.scrollLeft++;}
}
function getid(id){
return document.getElementById(id);
}
window.onload=init;
</script>
</head>
<body>
<div class="d1" id="div1" onm ouSEOver="clearInterval(timer)" onm ouSEOut="timer=setInterval(mar,30)">
<div class="scroll" id="scroll">
<div class="div2" id="div2">
<ul>
<li>蓝瘦香菇蓝瘦香菇蓝瘦香菇蓝瘦香菇蓝瘦香菇蓝瘦香菇</li>
</ul>
</div>
<div id="div3" class="div2"></div>
</div>
</div>
</body>
</html>
<!-- 来自 编程之家 jb51.cc （jb51.cc）-->