实现代码
html代码：
<div id="box">
<ul id="ul1">
<li>1111111111111111111111</li>
<li>2222222222222222222222</li>
<li>3333333333333333333333</li>
<li>4444444444444444444444</li>
<li>5555555555555555555555</li>
<li>6666666666666666666666</li>
<li>7777777777777777777777</li>
<li>8888888888888888888888</li>
<li>9999999999999999999999</li>
</ul>
<ul id="ul2"></ul>
</div>
css样式：
<style>
*{margin: 0;padding: 0}
#box{height: 140px; border: solid 1px; overflow: hidden;}
</style>
js代码：
<script>
window.onload = roll(50);
function roll(t) {
var ul1 = document.getElementById("ul1");
var ul2 = document.getElementById("ul2");
var box = document.getElementById("box");
ul2.innerHTML = ul1.innerHTML;
box.scrollTop = 0;
var timer = setInterval(rollStart, t);
box.onmouseover = function () {
clearInterval(timer)
}
box.onmouseout = function () {
timer = setInterval(rollStart, t);
}
}
function rollStart() {
if (box.scrollTop >= ul1.scrollHeight) {
box.scrollTop = 0;
} else {
box.scrollTop++;
}
}
</script>
