js文字无限循环向上滚动轮播

html

<div id="scrollBox">
    <ul id="con1">
        <li>假如我是一朵雪花，</li>
        <li>翩翩的在半空里潇洒，</li>
        <li>我一定认清我的方向</li>
        <li>飞扬，飞扬，飞扬</li>
        <li>这地面上有我的方向。</li>
        <li>不去那冷寞的幽谷，</li>
        <li>不去那凄清的山麓，</li>
        <li>也不上荒街去惆怅</li>
        <li>飞扬，飞扬，飞扬</li>
        <li>你看，我有我的方向！</li>
    </ul>
    <ul id="con2"></ul>
</div>

css

* {
	margin:0;
	padding:0;
}
ul,li {
	list-style:none;
	display:block;
}
#scrollBox {
	height:150px;
	width:300px;
	margin:100px auto;
	background:#ff0;
	overflow:hidden;
}
#scrollBox #con1,#con2 {
	width:280px;
	float:left;
}
#scrollBox li {
	height:15px;
	line-height:15px;
	text-align:center;
	margin-bottom:15px
}

js

var box = document.getElementById('scrollBox');
var con1 = document.getElementById('con1');
var con2 = document.getElementById('con2');
con2.innerHTML = con1.innerHTML;

function scrollUp() {
    if (box.scrollTop >= con1.offsetHeight) {
        box.scrollTop = 0;
    } else {
        box.scrollTop++
    }
}
var time = 50;
var mytimer = setInterval(scrollUp, time);
box.onmouseover = function() {
    clearInterval(mytimer);
}
box.onmouseout = function() {
    mytimer = setInterval(scrollUp, time);
}