2011-10-19 86 views
7

我要檢查,如果頁面滾動返回0,它已經完成加載,我使用這個代碼後:scrollTop的()在Chrome

$(document).ready(function(){ 
    alert($(window).scrollTop()); 
}); 

它運作良好,在Firefox,但在Chrome八方通返回0。爲什麼是這樣?

+0

這是什麼情況?您是否檢查訪客是否使用#hash標籤來訪問您的網頁?或者,您是否在檢查文檔完成加載之前查看訪問者是否滾動?或兩者? –

+1

我對只滾動到視圖中的元素運行動畫。但如果你向下滾動頁面並點擊刷新。重新加載的頁面會自動滾動到上一個滾動點(預先刷新),所以我想知道窗口的滾動位置以確定頁面上的哪些元素已滾動到視圖中並開始動畫 –

回答

2

$(window).scrollTop()將在窗口不滾動時返回0

0

請在頁面底部有一些文字和鏈接的頁面中嘗試以下代碼。記得有足夠的文字或空行,以使頁面的滾動,直到你可以看到我的按鈕

$(document).ready(function() { 
     alert($(window).scrollTop()); // first load if you did not scroll = 0 
     $("#button").click(function() { alert($(window).scrollTop()); }); 
     // hitting the button that is located on bottom of page 
     // - i had to scroll the page = xxx (68 in may case) 
    }); 

這是你的情況得到0正常的,因爲網頁不滾動,之間的偏移你的位置和頁面的頂部是0.

我試過Chrome,FF6,IE9。 我希望我有幫助。

+1

單擊#按鈕以獲取.scrollTop( )不是問題..如果你向下滾動頁面並點擊刷新。該頁面會從你滾動到(預先刷新)的點...這就是我想知道的位置。如果你在FF中這樣做會輸出corect值。在Chrome 14.0中,它返回0。 –

4

實際上,Firefox是唯一一個在domReady或window.onload上爲$(window).scrollTop()返回0的瀏覽器。 Chrome瀏覽器,Safari和IE都返回0,唯一安全的方式得到domready中滾動條的正確位置,作爲另一個答案上面提到的,要在窗口的滾動事件的事件處理程序如下:

$(document).ready(function(){ 
    $(window).scroll(function() { 
     console.log($(window).scrollTop()); 
     $(window).unbind('scroll'); 
    }); 
}); 
+0

我真的不明白爲什麼人們低估了你的答案。這真的有用。另外,我觀察到Chrome會觸發滾動事件兩次。首先在正常的頁面加載和第二次滾動到用戶以前的位置(例如,在點擊F5重新加載頁面後)。 – Fleshgrinder

2

的一旦DOM被加載,chrome恢復預刷新滾動位置。所以,滾動事件而不是事件的scrollTop會起作用。

2

我也有問題,scrollTop()總是在Chrome中返回0,無論我是否在windowdocument'html,body'上使用它。我終於發現,CSS是問題:

html, body { 
    height: 100%; 
    overflow-x: hidden; 
} 

其實,我完全不知道爲什麼,因爲你可以刪除這些代碼的部分,然後重新工作。奇怪,但問題就解決了;)

+0

非常感謝你!這確實很奇怪! 工作在Safari瀏覽器,但沒有在Chrome瀏覽器,我將這添加到我的CSS後,兩個瀏覽器都可以工作! – bbnn

0

我有同樣的問題,但後來加入的文檔聲明固定:

<!DOCTYPE html>