為什么改成負(fù)的就能滾到頭
為什么改成負(fù)的就能滾到頭
逗不逗a
2014-11-26
2 回答
舉報
0/150
提交
取消
為什么改成負(fù)的就能滾到頭
2014-11-26
舉報
2014-12-01
終于有人回我了，解釋的非常清楚，非常感謝
2014-12-01
回答這個問題前，先來看下為什么不改成負(fù)數(shù)就不行呢？
注意這句：var ispeed = Math.floor(osTop / 6);?
當(dāng)上面osTop的值小于6這個除數(shù)時，ispeed的值始終等于0（向下取整了），所以問題來了，當(dāng)ispeed的值不變時，osTop - ispeed 這個控制滾動條的值也就不變了，所以滾動條永遠(yuǎn)到不了頂。
實(shí)際中，當(dāng)osTop = 5 時，ispeed 為 0，下面兩句也始終為5：
document.documentElement.scrollTop = osTop - ispeed; // 兼容IE
document.body.scrollTop = osTop - ispeed; // 兼容FF、Chrome
所以滾動條一直停在距離頂部5px的地方。
OK，那為什么改成負(fù)數(shù)就行了呢？其實(shí)改負(fù)數(shù)的目的就是讓ispeed的值不為0.
實(shí)際中，當(dāng)osTop = 5（或小于5時），Math.floor(osTop / 6) 的值為 -1，這樣就使得 osTop + ispeed 的值始終能減小下去，直至到0.
這種用負(fù)數(shù)的方法不好理解，我是采用Math.ceil()這個方法（向上取整）實(shí)現(xiàn)的，代碼如下：
obtn.onclick = function(){
????// 定時器開啟
????timer = setInterval(function(){
????????// 獲取當(dāng)前滾動條距離頂部距離
????????var osTop = document.documentElement.scrollTop || document.body.scrollTop;
????????var ispeed = Math.ceil(osTop / 6);
????????document.documentElement.scrollTop = osTop - ispeed;
????????document.body.scrollTop = osTop - ispeed;
????????if(osTop == 0){
????????????clearInterval(timer);
????????}
????},30);
}