Question

我试图让我的导航粘贴......但是没有用..这里是我的JQuery代码：

$(document).ready(function() {
    var stickyNavTop = $('nav').offset().top;
    var stickyNav = function(){
        var scrollTop = $(window).scrollTop();
        if (scrollTop > stickyNavTop) {
            $('nav').addClass('sticky');
        } else {
            $('nav').removeClass('sticky');
        }
    };
    stickyNav();
    $(window).scroll(function() {
        stickyNav();
    });
});

和使用过的css-definitions：

.sticky {
    position: fixed;
    top: 0;
}
nav {               
    background: url('bilder/bg_nav.png') no-repeat;
    width: 800px;
    margin: 0 auto;
    height: 40px;
}

您可以在link

看到所有内容

谢谢你的帮助！

Answer 1

我没有在你的html中找到jQuery库，你应该将这个片段放在你的html的<head>部分中，以使你的jQuery代码工作：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>

Answer 2

您还需要包含jquery框架，即http://code.jquery.com/jquery-2.0.3.js

我有一个例子供你跟随。

http://jsfiddle.net/

JQuery Navigation Sticky

2 个答案: