亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

當前代碼,當鼠標快速滑動時,滾動速度變得非常快,各位大神幫忙看看啊!怎么才能讓鼠標來回移入時,滾動不再變快

當前代碼,當鼠標快速滑動時,滾動速度變得非??欤魑淮笊駧兔纯窗?!怎么才能讓鼠標來回移入時,滾動不再變快

<!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>無標題文檔</title><style type="text/css">a{text-decoration:none;color: #333;}a:hover { color: #ff0000;}*{margin:0;padding:0;font-size:12px;font-family:微軟雅黑}#odiv{height:200px;width:400px;border:3px solid #999;margin:0 auto;margin-top:20px;border-radius:15px;box-shadow:2px 2px 4px #CCC}#div1{background:#C00;height:50px;width:370px;display:block;color:#FFF;font-size:20px;line-height:50px;padding-left:30px;border-top-left-radius:12px;border-top-right-radius:12px;margin:0 auto;position: relative;}#div1 a{text-decoration:none;position: absolute; right: 10px; bottom: 10px; display: inline; color: #fff; font-size: 12px; line-height: 24px;}#div2{width:396px;height:146px;margin-left:15px;overflow:hidden}ul{list-style:none}#div2 ul li{height:25px;}#div2 ul li a{width:300px;float:left;height:25px;display:block;}#div2 ul li span{width:80px;height:25px;text-align:center;margin-right:5px;colos:#CCC;}</style></head><body><div id="odiv">? ?<div id="div1">? ?最新課程? ?<a href="#">更多《</a>? ?</div>? ?<div id="div2">? ?<ul id="con1">? ?<li><a href="#">1.學會html5 絕對的屌絲逆襲(案例)</a><span>2013-09-18</span></li>? ? ? ? <li><a href="#">2.tab頁面切換效果(案例)</a><span>2013-10-09</span></li>? ? ? ? <li><a href="#">3.圓角水晶按鈕制作(案例)</a><span>2013-10-21</span></li>? ? ? ? <li><a href="#">4.HTML+CSS基礎課程(系列)</a><span>2013-11-01</span></li>? ? ? ? <li><a href="#">5.分頁頁碼制作(案例)</a><span>2013-11-06</span></li>? ? ? ? <li><a href="#">6.導航條菜單的制作(案例)</a><span>2013-11-08</span></li>? ? ? ? <li><a href="#">7.信息列表制作(案例)</a><span>2013-11-15</span></li>? ? ? ? <li><a href="#">8.下拉菜單制作(案例)</a><span>2013-11-22</span></li>? ? ? ? <li><a href="#">9.如何實現“新手引導”效果</a><span>2013-12-06</span></li>? ?</ul>? ?<ul id="con2">? ? </ul>? ?</div></div><script type="text/javascript">var area=document.getElementById("div2");var ul1=document.getElementById("con1");var ul2=document.getElementById("con2");ul2.innerHTML=ul1.innerHTML;var speed=50;var time;var liheight=25area.scrollTop=0;function startscroll(){ time=setInterval(scrollUp,speed); area.scrollTop++; ? }function scrollUp(){ if(area.scrollTop % liheight==0){ clearInterval(time); ? ? ? ? ?var time2=setTimeout(startscroll,2000); }else{ area.scrollTop++; if(area.scrollTop >= area.scrollHeight/2){ ? area.scrollTop =0; ? ?} } }??setTimeout("startscroll()",50);?area.onmouseover=function(){clearInterval(time); area.scrollTop=area.scrollTop }area.onmouseout=function(){clearInterval(time); startscroll(); }</script></body></html>
查看完整描述

1 回答

已采納
?
ppo_YXWU

TA貢獻9條經驗 獲得超1個贊

主要是這句的問題:?var time2=setTimeout(startscroll,2000);

這句是兩秒后調用startscroll函數,但是當在這兩秒內你再移動鼠標離開元素觸發

area.onmouseout=function(){

clearInterval(time);

startscroll();

}

時,就會調用多次的startscroll函數,這時time=setInterval(scrollUp,speed);這句多次賦值,會造成多個循環調用,而且time只會指向最后一次賦值的循環調用。所以后面的clearInterval(time);只能清除一次循環調用,而對之前的毫無作用。所以就會形成惡性循環,越來越快。

解決方法:可以在賦值語句time=setInterval(scrollUp,speed);前加個清除循環語句:clearInterval(time);

function startscroll(){
clearInterval(time);
time=setInterval(scrollUp,speed);
area.scrollTop++;
}

查看完整回答
反對 回復 2016-01-06
  • 1 回答
  • 0 關注
  • 2184 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號