easy way navbar bootstrap

Question

I started to use Bootstrap. Right now I am looking for a navbar in bootstrap here. The side navbar html and JavaScript I tried to take (the fixed side navbar see it in the l

Answer 1

If you're looking to add the fixed sidebar like bootstrap uses for their docs, like noted here http://getbootstrap.com/javascript/#affix, try this:

Add id="foo" data-spy="affix" data-offset-top="100" data-offset-bottom="10" to the <div> or <ul> you want to lock in place upon scroll.

and add the javascript at the bottom of your page:

<script type="text/javascript">
 $('#foo').affix({
    offset: {
      top: 100
    , bottom: function () {
        return (this.bottom = $('.footer').outerHeight(true))
      }
    }
  })
</script>

From there, you'll want to adjust the height at which you want it to lock by adjusting the 'top' elements.

For example:

<div id="foo" data-spy="affix" data-offset-top="100" data-offset-bottom="10">
  <!-- everything in here is be fixed to top -->
</div>

<script type="text/javascript">
  $('#foo').affix({
    offset: {
      top: 100
        , bottom: function () {
           return (this.bottom = $('.footer').outerHeight(true))
      }
    }
  })
</script>

FYI, I would suggest a more new title for your post, perhaps "Fixed/sticky navigation with bootstrap." instead of "easy way navbar bootstrap" (just my opinion)