<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
#box{
background: whitesmoke;width: 300px; height: 32px;overflow: hidden;
}
#con1,#con2{margin: 0;padding: 0}
li{list-style: none;}
a{text-decoration: none;color: #666;}
a:hover{color: red;}
</style>
<script>
window.onload=function(){
var box=document.getElementById('box');
var con1=document.getElementById('con1');
var con2=document.getElementById('con2');
var time=50;
box.scrollTop=0;
con2.innerHTML=con1.innerHTML;
function fnTop(){
if(box.scrollTop>=con1.scrollHeight){
box.scrollTop=0;
}else {
box.scrollTop++;
}
}
var Oup= setInterval(fnTop,time);
box.onmouseover = function(){
clearInterval(Oup);
}
box.onmouseout = function(){
var Oup= setInterval(fnTop,time);
}
}
</script>
</head>
<body>
<div id="box">
<ul id="con1">
<a href="#"><li>1.longjuanfeng</li></a>
<a href="#"><li>2.jiandanai</li></a>
<a href="#"><li>3.xingqing</li></a>
<a href="#"><li>4.aizaixiyuanqian</li></a>
<a href="#"><li>5.keainvren</li></a>
<a href="#"><li>6.huidaoguoqu</li></a>
</ul>
<ul id="con2"></ul>
</div>
</body>
</html>
qq_流年_22
solitary2015
随时随地看视频慕课网APP
相关分类