移動一個div相對於你在一個可滾動頁面上的垂直位置

Question

想象一下，我有一個網站溢出了三倍的視口高度。我可以從這個網站上下滾動。

是否可以創建一個div，從視口的頂部移動到底部，相對於已滾動的總頁面數量？

示例 - 有人會介意幫助我實現類似this的行爲嗎？不知道它是如何完成的。

編輯：

var scrollValue; 
    var percent; 

    var body = document.body, 
     html = document.documentElement; 

    var height = Math.max(body.scrollHeight, body.offsetHeight, 
    html.clientHeight, html.scrollHeight, html.offsetHeight); 

    $(document).ready(function(){ 
     $("button").click(function(){ 
        scrollValue = $("body").scrollTop(); 
        percent = (scrollValue/height) * 100; 
        alert(percent); 
     }); 
    }); 

Answer 1

您可以嘗試使用jQuery scrollTop()。請參閱demo at jquery.com。

理念： 如果你瞭解這兩種類型中使用此功能（帶/不帶參數），你可以使用相同的功能，讓您的自定義滾動條的當前滾動位置的，則觸發您的div滾動到相對滾動位置。

備用任務：如果你想上滾動鼠標滾輪移動定製的滾動條，我建議使用jquery mousewheel plugin -

$(window).mousewheel(function(turn, delta) { 

    if (delta == 1) // going down 
    else //going up 

    // all kinds of code 

    return false; 
});