Bootstrap, rendere un navbar appiccicoso dopo averlo fatto scorrere verso il basso?

Ho una barra di navigazione che si trova sotto l'immagine dell'intestazione. Voglio che la barra di navigazione si attacchi alla parte superiore della pagina Web quando scorro verso il basso. Non riesco a pensare a jQuery o CSS richiesti, perché la barra di navigazione sembra rimanere proprio sotto l'immagine dell'intestazione lasciando un po 'di spazio.Bootstrap, rendere un navbar appiccicoso dopo averlo fatto scorrere verso il basso?

<div class="headerwrap pull-center"> 
<div class="container"> 
    <div id="header" class="row-fluid"> 
     <div class="span5" id="phones"> 
      <img class="phone" src="img/white.png" alt=""> 
     </div> 
     <div class="span7" id="mm-logo"> 
      <img class="mm-log" src="img/logo.png" alt=""> 
     </div> 
    </div> 
</div> 
</div> 


<div class="navbar navbar-inner" id="border-stuff"> 
    <div class="span12"> 

     <!-- .btn-navbar is used as the toggle for collapsed navbar content --> 
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> 
<span class="icon-bar"></span> 
<span class="icon-bar"></span> 
<span class="icon-bar"></span> 
</a> 

<!-- Everything you want hidden at 768px or less, place within here --> 
<div class="nav-collapse collapse" id="center-nav"> 
<ul class="nav" > 
    <li><a href="#h1"><h3>Heading1</h3></a></li><li class="divider-vertical"></li> 
    <li><a href="#h2"><h3>Heading2</h3></a></li><li  class="divider-vertical"></li> 
    <li><a href="#h3"><h3>Heading3</h3></a></li><li class="divider-vertical"> </li> 
    <li><a href="#h4"><h3>Heading4</h3></a></li><li class="divider-vertical"></li> 
    <li><a href="#h5"><h3>Heading4</h3></a></li> 
</ul> 
</div> 

</div> 
</div>

fonte

2013-07-16 user2441391

sarebbe bello se tu avessi un jsfiddle .. –

Se volete che il vostro barra di navigazione di rimanere fissato nella parte superiore dello schermo, solo una volta l'immagine di testa ha fatto scorrere via è possibile utilizzare the bootstrap affix plugin.

fonte

2013-07-16 21:49:36

Non ho potuto ottenere il plugin affisso per funzionare in una barra di navigazione come la maggior parte dei tutorial mostrano che viene utilizzato come barra di navigazione laterale. Potresti aiutarmi a creare una barra di navigazione superiore usando il plugin affisso? – user2441391

Per un esempio controlla jsFiddle in questa risposta: http://stackoverflow.com/questions/12070970/how-to-use-the-new-affix-plugin-in-twitters-bootstrap-2-1-0/ 13151016 # 13151016 –

Hai solo bisogno di sostituire il codice jQuery per questo:

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

e regolare la parte superiore a tutto ciò che si adatta meglio.

fonte

2014-02-26 18:16:54 Henrique

Bootstrap, rendere un navbar appiccicoso dopo averlo fatto scorrere verso il basso?

risposta

Problemi correlati