2014-10-31 2 views
0

Я пытаюсь использовать ассемблер Bootstrap на моем навигаторе, чтобы зафиксировать его сверху, как только он достигнут, прокручивая вниз.Консоль имеет «Невозможно прочитать свойство« сверху »неопределенной ошибки»

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> 

This is what my console looks like

JS:

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

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

я установить позицию для нав в моем CSS, в соответствии с требованиями Bootstrap документации.

#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; 
} 
+2

Это означает, что вызов '.offset()' возвращает 'undefined'. Это, в свою очередь, означает, что нет элемента, найденного с идентификационной «навигацией». – Pointy

+0

Я изменил идентификатор в селекторе на #nav, и я все равно получаю ту же ошибку. И у меня определенно есть #nav в моем стиле CSS. – Dimoff

+1

Не имеет значения, находится ли это в вашем CSS - важно то, есть ли элемент с этим идентификатором в вашем HTML. (Тем не менее, я вижу, что это, по-видимому, есть в HTML, который вы разместили.) Возможно ли, что код JavaScript работает до того, как будет создана эта часть страницы? – Pointy

ответ

0

Twitter Bootstrap имеет класс .navbar-fixed-top, который можно применить к вашему DIV с классом .navbar.

Я бы предположил, что это сделало бы трюк для вас.

+0

.navbar-fixed-top фиксирует его до самого верха в любое время. То, что я хочу, похоже на это http://jsfiddle.net/namuol/Uaa3U/. Я хочу, чтобы это было исправлено вверху ONCE, это было достигнуто не по умолчанию. – Dimoff

Смежные вопросы