示例：
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>滾動效果</title>
<style type="text/css">
div {
border: 1px solid #E5E5E5;
}
ul {
height: 200px;
overflow: hidden;
}
li {
line-height: 30px;
}
</style>
</head>
<body>
<div style="height: 200px; overflow: hidden">
<ul id="marquee" style="height: 170px">
<li><a>測試01</a></li>
<li><a>測試02</a></li>
<li><a>測試03</a></li>
<li><a>測試04</a></li>
<li><a>測試05</a></li>
<li><a>測試06</a></li>
<li><a>測試07</a></li>
<li><a>測試08</a></li>
<li><a>測試09</a></li>
<li><a>測試10</a></li>
</ul>
</div>
<marquee>This text will scroll from right to left.</marquee>
<script type="text/javascript">
window.onload = function() {
setTimeout(startmarquee(34, 50, 0, "marquee"), 1000);
}
function startmarquee(lh, speed, delay, id) {
var t;
var p = false;
var o = document.getElementById(id);
o.innerHTML += o.innerHTML + o.innerHTML + o.innerHTML;
o.onmouseover = function() {
p = true;
}
o.onmouseout = function() {
p = false;
}
o.scrollTop = 0;
function start() {
t = setInterval(scrolling, speed);
if (!p)
o.scrollTop += 2;
}
function scrolling() {
if (o.scrollTop % lh != 0) {
o.scrollTop += 2;
if (o.scrollTop >= o.scrollHeight / 2)
o.scrollTop = 0;
} else {
clearInterval(t);
setTimeout(start, delay);
}
}
setTimeout(start, delay);
}
</script>
</body>
</html>