是一個反向粘滯滾動使用jQuery可能嗎？

Question

我想創建一個網站，一個元素是使用下面的CSS固定在瀏覽器底部產生影響：

div.featured-image { 
width: 100%; 
position: fixed; 
z-index: 10; 
} 

，我想發生的事情就是用這樣的http://vertstudios.com/blog/demo/stickyscroller/demo.php到停止滾動UP過去的某個點。我在網站頂部放置了一個標誌，絕對不會讓固定項目重疊，如果瀏覽器不夠高。所以我試圖讓它無法滾動到頂部大約800px的緩衝區，但仍然保持固定在頁面的底部。

Answer 1

你可以用jQuery做到這一點，並根據scrollTop()動態地設置/重置元素的頂部和底部屬性css。

樣品的JQuery：

$('#footer').css('top','550px'); 
$(document).bind('scroll',function(event) { 
    var scrollTop = $(window).scrollTop(); 
    if (scrollTop <= 550) { 
     $('#footer').css('bottom',''); 
     $('#footer').css('top','550px'); 
    } else { 
     $('#footer').css('top',''); 
     $('#footer').css('bottom','0px'); 
    } 
}); 

CSS（DIV爲＃頁腳）：

#footer{ 
    position: fixed; 
    left: 0px; 
    display: block; 
    background-color: green; 
    z-index: 10; 
    height: 100px; 
    width: 100%; 
} 

和工作fiddle。