元素滾動頁面，但應停止在特定的最高值

Question

我有一個非常長的頁面。而且我有一個<div id="scroll_tiles"></div>與頁面滾動，但在開頭一個特定的值：

#scroll_tiles { 
    position: absolute; 
    width: 150px; 
    height: 150px; 
    top: 500px; 
} 

所以我在做什麼是以下幾點：

var scrollingDiv = jQuery("#sort_tiles"); 

jQuery(window).scroll(function(){   
    scrollingDiv 
    .stop() 
    .animate({"top": (jQuery(window).scrollTop()) + (50) + "px"}, "slow");   
}); 

，但是當我滾動回頂部，div顯然不像最初那樣至少保持top: 500px。如何做到這一點，該功能就像它一樣工作，但當來到top: 500px它保持在那裏的div，即使scrolltop()少。

當我向下滾動時，它應該像以前一樣工作。

感謝

Answer 1

var scrollingDiv = jQuery("#sort_tiles"); 
jQuery(window).scroll(function() { 
    var myScrollTop = jQuery(window).scrollTop() + 50; // get the value 
    myScrollTop = myScrollTop > 500 ? myScrollTop.toString() + "px" : "500px"; // validate if > 500 

    scrollingDiv.stop().animate({"top": myScrollTop }, "slow");   
});