直接贴代码
<html>
<body>
<head>
<style>
#scrolldiv {
width: 200px;
height: 100px;
overflow: hidden;
}
ul{
list-style: none;
}
</style>
</head>
<div id="scrolldiv" class="scroll">
<ul>
<li>开始</li>
<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>结束</li>
</ul>
</div>
<script>
window.onload = roll(40);
function roll(t) {
var scrolldiv = document.getElementById("scrolldiv");
scrolldiv.scrollTop = 0;
setInterval(rollStart, t);
}
function rollStart() {
//元素内容的真实高度 元素滚动的高度 元素可见的高度
if (
scrolldiv.scrollHeight - scrolldiv.scrollTop ===
scrolldiv.clientHeight
) {
scrolldiv.scrollTop = 0;
} else {
scrolldiv.scrollTop++;
}
}
</script>
</body>
</html>
