jQuery sticky div頁面頂部

Question

當我向下滾動時，我試圖讓我的div粘在窗口的頂部。 我出於某些原因甚至無法瞄准目標。

我附上了一個小提示，向您展示我當前的代碼。 任何人都可以看到我可能出錯的地方？

http://jsfiddle.net/rn3yc/

JS：

var $sidebar   = $(".sidebar"),
    $window    = $(window),
    offset     = $sidebar.offset(),
    topPadding = 15;

$window.scroll(function() {
    if ($window.scrollTop() > offset.top) {
        $sidebar.addClass('fixed');
    } else {
        $sidebar.removeClass('fixed');
    }
});

Answer 1

檢查這個好的和簡單的CSS技巧來制作粘性元素： http ： //updates.html5rocks.com/2012/08/Stick-your-landings-position-sticky-lands-in-WebKit

編輯

或者這個： https ： //github.com/imakewebthings/jquery-waypoints

Answer 2

你沒有固定的課程。 寫一個並將其添加到CSS。 另外，你的小提琴在js中有未閉合的括號。

jsfiddle.net/Nn7d2/show/是一個固定版本。

Answer 3

我為你創造了一個小提琴。 剛剛使用ID更改了類並應用了

position:fixed

在CSS中。 這是小提琴jsfiddle.net/rn3yc/10/

Answer 4

我不知道這是你正在尋找的，但只是試着看。

jsfiddle.net/4RNLC/

Answer 5

您可以使用css的position屬性來修復標題。

.fixedHeader {
位置：固定;
頂部：0px;
}