求各位大神指點(diǎn)
怎么給間歇性循環(huán)滾動(dòng)加鼠標(biāo)移入停止，移出繼續(xù)滾動(dòng)的效果？？
咿呀咿呀噠噠
2016-09-01
1 回答
舉報(bào)
0/150
提交
取消
2016-09-01
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標(biāo)題文檔</title>
<style>
*{
?? ?margin:0;
?? ?padding:0;
?? ?}
#mooc{
?? ?width:200px;
?? ?height:78px;
?? ?}
#moocTitle{
?? ?width:200px;
?? ?height:30px;
?? ?background:#f00;
?? ?}
#moocBox{
?? ?width:200px;
?? ?height:48px;
?? ?overflow:hidden;
?? ?}
p{
?? ?width:180px;
?? ?padding-left:20px;
?? ?height:24px;
?? ?}
p:hover{
?? ?color:red;
?? ?}
</style>
</head>
<body>
<div id="mooc">
?? ?<div id="moocTitle">MOOC TITLE</div>
??? <div id="moocBox">
?? ??? ?<div id="con1">
?????? ??? ?<p>1.XXXXXXXX</p>
??????????? <p>2.XXXXXXXX</p>
??????????? <p>3.XXXXXXXX</p>
??????????? <p>4.XXXXXXXX</p>
??????????? <p>5.XXXXXXXX</p>
??????????? <p>6.XXXXXXXX</p>
??????????? <p>7.XXXXXXXX</p>
??????????? <p>8.XXXXXXXX</p>
??????????? <p>9.XXXXXXXX</p>
??????????? <p>10.XXXXXXXX</p>
??????? </div>
?????? ?
??? </div>
</div>
<script>
var area=document.getElementById('moocBox');//滾動(dòng)區(qū)域
var lineHeight=48;//兩倍p的高度
var timer=null;//定時(shí)器
area.innerHTML+=area.innerHTML; //克隆
area.scrollTop=0;//初值
function marquee(){//運(yùn)動(dòng)
?? ?area.scrollTop++;
?? ?if(area.scrollTop%lineHeight==0){//檢測(cè)等待
?? ??? ?clearInterval(timer);
?? ??? ?timer=setTimeout("timer=setInterval('marquee()',50)",2000);//等待后再滾動(dòng)
?? ??? ?}else{?? ?
?? ??? ??? ?if(area.scrollTop>=area.scrollHeight/2){//無縫滾動(dòng)
?? ??? ??? ??? ?area.scrollTop=0;
?? ??? ??? ??? ?}
?? ??? ??? ?}
?? ?}
timer=setInterval('marquee()',50);
area.onmousemove=function(){//移入停止
?? ?clearInterval(timer);
?? ?clearTimeout(timer);
?? ?}
area.onmouseout=function(){//移出繼續(xù)
?? ?clearTimeout(timer);
?? ?timer=setInterval('marquee()',50);
?? ?}
</script>
</body>
</html>
//我自己寫了一個(gè)，可以運(yùn)行，，但刷新第一次1、2條滾動(dòng)時(shí)不停留2秒；