根據頁面的哪一部分是可見的，你如何在網頁上有浮動/固定元素？

Question

這個問題令人困惑，我知道，但我無法用其他方式。

這裏的網址：Configure - Apple Store (U.S.)

就在身邊的「摘要」框的子標題下方對齊（與所有的Mac機型的圖片），並在相同的高度內容分塊。如果您向上滾動頁面，則整個頁面會按預期上升。但是，當內容塊滾動瀏覽器窗口的可視區域時，即使您滾動到頁面的最遠端，摘要塊也會將其自身保持在頂層並保持在此位置。

這種行爲稱爲什麼，什麼是最簡單，最乾淨的方式來實現它？我更喜歡使用jQuery插件和/或代碼片段來代替普通的JavaScript。

Answer 1

你可以做這樣的事情：

$(function() { 
    var $el = $('.fixedElement'), 
     originalTop = $el.offset().top; // store original top position 

    $(window).scroll(function(e){ 
    if ($(this).scrollTop() > originalTop){ 
     $el.css({'position': 'fixed', 'top': '0px'}); 
    } else { 
     $el.css({'position': 'absolute', 'top': originalTop}); 
    } 
    }); 
}); 

檢查爲例here。

最新問題

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.

 相關問題

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.