如何獲得股利頂部位置值，而滾動

我想，當時，它的滾動的div達到一定點運行一些腳本。有一個固定的導航，當用戶滾動窗口時，假設一旦它接近導航，就改變導航名稱。我使用$（window）.scroll函數，但它只檢查div位置一次而不更新值。如何使滾動檢查窗口的大小每5-10 px移動，以便它不會佔用太多的內存/處理。代碼設置爲：http://jsfiddle.net/rexonms/hyMxq/如何獲得股利頂部位置值，而滾動

HTML

<div id="nav"> NAVIGATION 
    <div class="message">div name</div> 
</div> 
<div id="main"> 
<div id="a">Div A</div> 
<div id ="b"> Div B</div> 
<div id ="c"> Div C</div> 
</div>

CSS

#nav { 
    height: 50px; 
    background-color: #999; 
    position:fixed; 
    top:0; 
    width:100%; 

} 

#main{ 
    margin-top:55px; 
} 
#a, #b, #c { 
    height:300px; 
    background-color:#ddd; 
    margin-bottom:2px; 
}

SCRIPT

$(window).scroll(function() { 

    var b = $('#b').position(); 

    $('.message').text(b.top); 

    if (b.top == 55) { 
     $('.message').text("Div B"); 
    } 
});

來源

2012-09-19 rex

它，事實上，檢查'B'的上滾動的每個增量位置，但'相對於文件不會改變B'的位置。請參閱@ j08691的答案。 – Shmiddty

試試這個jsFiddle example

$(window).scroll(function() { 
    var scrollTop = $(window).scrollTop(), 
     divOffset = $('#b').offset().top, 
     dist = (divOffset - scrollTop); 
    $('.message').text(dist); 
    if (b.top == 55) { 
     $('.message').text("Div B"); 
    } 
});

你原來的代碼只是檢查相對於文件頂部的div的位置，它永遠不會改變。您需要計算窗口產生的滾動量並據此計算。

還要注意beyween jQuery的.position()和.offset()方法的不同。 .position()方法允許我們檢索元素相對於偏移父級的當前位置。將其與.offset()進行對比，該文件檢索相對於文檔的當前位置。

來源

2012-09-19 21:01:22 j08691

另外，'b.top == 55'永遠不會是真的。 – Shmiddty

@Shmiddty - 真實的，但是這將剛剛成爲'如果（DIST == 55）'。 – j08691

我懷疑這是OP試圖做什麼的意圖。我認爲它應該是'如果（dist <55）' – Shmiddty

如何獲得股利頂部位置值，而滾動

回答

相關問題