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

為了賬號安全,請及時綁定郵箱和手機立即綁定

var isTop = true; window.onscroll=function(){ if (!isTop) { clearInterval(time); }; isTop= false; } 這段代碼表示沒看懂,哪位朋友能幫我指點一二啊

正在回答

4 回答

首先你點擊回到頂部時,滾動條開始往回滾,這時候istop為true,因為滾動條滾動觸發window.onscroll 事件,!istop為false不執行clearInterval(timer);但是下面的isTop=false;再將isTop置為false。這時候你人為滾動鼠標,則再次觸發window.onscroll 事件,此時!istop為true 執行clearInterval(timer);則滾動條停下來

8 回復 有任何疑惑可以回復我~
#1

Sunshine518

下面的isTop=false;再將isTop置為false,這時候人為滾動鼠標和下面的定時器都同時還在運行吧,為什么不是在這在之前定時器先把isTop置為true呢,怎么可以通過人為滾動鼠標就直接認定isTop=false,而不用再經過下面的定時器isTop=true,畢竟它是{ if (!isTop) { clearInterval(time); }; isTop= false; } ,而不是{ isTop= false; if (!isTop) { clearInterval(time); };} 求解
2014-10-05 回復 有任何疑惑可以回復我~
#2

Sunshine518

是不是因為 定時器需要30ms的時間來反應,而人為滾動鼠標是一系列的動作,定時器還來不及把isTop設置為true,onscroll就已經連續觸發了
2014-10-05 回復 有任何疑惑可以回復我~

我不同意一樓的答案,因為window.scroll是連續執行多次的

測試方法:

54d223e5000131f105000199.jpg

執行效果就是:

每50ms執行一次滾動,但是一滾動就會停止,說明window.scroll是執行多次的。

接下來分析代碼

54d224800001543905000355.jpg

實際的執行順序:

1.執行setInterval事件,由于有isTop=true,所以當執行下一次scroll的時候,isTop是ture

2.執行onscroll,先執行if(!isTop)判斷,然后在給isTop 賦值 false,重復執行1

3.當有人為滾動,重復執行2,(此時因為isTop 賦值為false,故if(!isTop) 是,結果為真,即執行clear操作),此時isTop 應為false


證明:

54d226dc000143c402040098.jpg

執行結果(我向下滾動,前面的4代表執行了4次if判斷)

54d226dc000190fa00840023.jpg



3 回復 有任何疑惑可以回復我~
#1

YDJS

正解。不過感覺加這個效果沒啥用處。
2015-09-08 回復 有任何疑惑可以回復我~

下面的isTop=false;再將isTop置為false,這時候人為滾動鼠標和下面的定時器都同時還在運行吧,為什么不是在這在之前定時器先把isTop置為true呢,怎么可以通過人為滾動鼠標就直接認定isTop=false,而不用再經過下面的定時器isTop=true,畢竟它是{ if (!isTop) { clearInterval(time); }; isTop= false; } ,而不是{ isTop= false; if (!isTop) { clearInterval(time); };} 求解

0 回復 有任何疑惑可以回復我~

意思就是只有當滾動條到達頂部的時候才取消定時器,取消定時器后就不會出現滑到中間強行向上的情況。這里的isTop=false 還有定時器里的isTop=true就是保證在沒滾動到頂端前定時器不被取消,就是連續滾的意思。我也是初學者,說的比較啰嗦,不知道對不對,希望相互學習

1 回復 有任何疑惑可以回復我~

舉報

0/150
提交
取消
回到頂部效果
  • 參與學習       44195    人
  • 解答問題       214    個

回到頂部網站不可缺少的一部分,用JS實現炫酷拉風的回到頂部效果

進入課程
微信客服

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

幫助反饋 APP下載

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

公眾號

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