求大神帮忙看看哪错了,滚不起来啊
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
div{
width:200px;
height:160px;
margin:0 auto;
margin-top: 200px;
border:1px solid black;
overflow: hidden;
}
li{
text-align: center;
list-style-type: none;
font-size: 14px;
height:24px;
line-height: 24px;
}
</style>
</head>
<body>
<div id="box">
<ul id="con1">
<li>
慕课网慕课慕</li>
<li>
慕课网慕课慕
</li>
<li>
慕课网慕课慕
</li>
<li>
慕课网慕课慕
</li>
<li>
慕课网慕课慕
</li>
<li>
慕课网慕课慕
</li>
</ul>
<ul id="con2"></ul>
</div>
</body>
<script>
var area=document.getElementById('box');
var con1=document.getElementById('con1');
var con2=document.getElementById('con2');
con2.innerHTML=con1.innerHTML;
function scrollUp() {
if(area.scrollTop>=con1.scrollHeight){
area.scrollTop=0;
}
else{
area.scrollTop++;
}
}
var time=50;
var myscroll=setInterval('scrollUp',time)
area.onmouseover=function () {
clearInterval(myscroll);}
area.onmouseout=function () {
myscroll=setInterval('scrollUp',50);
}
</script>
</html>