控制台具有“无法读取未定义错误的属性”顶部”

Question

I'm trying to use Bootstrap affix on my navbar to get it fixed on top, once it's been reached by scrolling down.

HTML:

<div id="nav-wrapper">
    <div class="container"><!--container-->
        <div class="row" id="navigation"><!--header-->
            <div class="col-md-12"><!--col-md-12-->
                <div class="navbar" id="nav"><!--nav-->
                    <div class="menu-main-menu-container">
                        <ul id="menu-main-menu" class="menu">
                            <li><a href="http://endurancefilmsti.com/">Home</a></li>
                            <li><a href="http://endurancefilmsti.com/about-efti/">About EFTI</a></li>
                            <li><a href="http://endurancefilmsti.com/our-coaches/">Our Coaches</a></li>
                            <li><a href="http://endurancefilmsti.com/blog/">Blog</a></li>
                            <li><a href="http://endurancefilmsti.com/efti-forum/">EFTI Forum</a></li>
                            <li><a href="http://endurancefilmsti.com/contact-us/">Contact Us</a></li>
                        </ul>               
                    </div>       
                </div><!--nav-->
            </div><!--col-md-12-->
            <div class="clearfix"></div>
        </div><!--header-->
    </div><!--container-->
</div>

JS:

$(function() {
    $('#nav-wrapper').height($("#nav").height());

    $('#nav').affix({
        offset: { top: $('#nav').offset().top }
    });
});

I have set the position for the nav in my CSS, as required by Bootstrap documentation.

#nav.affix {
    position: fixed;
    top: 0;
    width: 100%;
}

#nav > .navbar-inner {
    border-left: 0;
    border-right: 0;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -o-border-radius: 0;
}

Answer 1

Twitter Bootstrap has a class .navbar-fixed-top which you could apply to your div with the class .navbar .

I would imagine that would do the trick for you.