<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>www.jb51.net - 间歇循环滚动</title>
<style>
#box {
height: 200px;
width: 300px;
margin: 0 auto;
border: 1px solid #0066ff;
overflow: hidden;
box-sizing: border-box;
}
#box li {
color: #333;
height: 24px;
}
#box ul {
margin: 0;
padding: 0;
}
</style>
</head>
<body>
<div id="box">
<ul id="con1">
<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>
</ul>
</div>
<script>
var area = document.getElementById("box");
area.innerHTML += area.innerHTML;
var count = document.getElementById("con1").getElementsByTagName("li")
.length;
var height1 = 24;
area.scrollTop = 0;
console.log(area.scrollTop, area.offsetHeight, count);
function scrollUp() {
console.log(area.scrollTop, area.offsetHeight);
if (area.scrollTop < area.offsetHeight) {
area.scrollTop++;
} else {
area.scrollTop = 1;
}
}
setInterval("scrollUp()", 50);
</script>
</body>
</html>
