I'm using bootstrap and I have a common navbar:
<div class="navbar navbar-fixed-top">
<div class="container">
<button type="button" class="navbar-toggle navbar-default" data-toggle="collapse" data-target=".navbar-collapse">
Menu
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<div class="navbar-collapse collapse navbar-default">
<nav id="nav-bottom" role="navigation">
<div class="navbar-inner">
<ul class="nav navbar-nav">
<li>
@Html.ActionLink("Biografia", "Index", "BiografiaMauricio")
</li>
<li>
@Html.ActionLink("Agenda", "Index", "AgendaMauricio")
</li>
<li>
<a href="http://www.consulfarma.com/CursoVideo.aspx?Modulo=Professor&Categoria=Maur%C3%ADcio%20Pupo" target="_blank">Cursos a Distância</a>
<li>
<a href="http://ipupo.com.br/cursos/pos/CosmetologiaClinica.aspx" target="_blank">Pós-Graduação</a>
</li>
<li>
@Html.ActionLink("Artigos Técnicos", "Index", "Artigos")
</li>
<li>
@Html.ActionLink("Vídeos", "Index", "Videos")
</li>
<li>
@Html.ActionLink("Saiu na Mídia", "Index", "SaiuMidia")
</li>
<li>
@Html.ActionLink("Livros", "Index", "Livros")
</li>
<li>
@Html.ActionLink("Fotos", "Index", "Fotos")
</li>
<li>
<a href="https://www.facebook.com/" target="_blank">Facebook</a>
</li>
<li>
@Html.ActionLink("Contato", "Index", "Contato")
</li>
</ul>
</div>
</nav>
</div>
</div>
</div>
When scrolling, my nav should become fixed and follow the page. How could I proceed?