Search code examples
htmlcsswordpresstwitter-bootstrapnavbar

Fixed navbar with bootstrap

I'm trying to change the navbar in my child theme but I'm a newbie. I read some questions here about that and even saw the bootstrap site, but I don't understand how to solve my problem. I'm sorry for my ignorance but could someone explain to me how it works?

I'm using this theme http://demos.codexcoder.com/#limo_wp and I would like to fixed the navbar instead of this "blink" and float. Just stay fixed after scroll the page.

Solution

  • You can find an example on the bootstrap website.

    http://getbootstrap.com/examples/navbar-fixed-top/

    Or you can change 

    <section id="headnev" class="navbar topnavbar">

    to

    <section id="headnev" class="navbar navbar-fixed-top">

    in your header file and remove:

    // Script for top Navigation Menu
    jQuery(window).bind('scroll', function () {
      if (jQuery(window).scrollTop() > 100) {
        jQuery('#headnev').addClass('navbar-fixed-top').removeClass('topnavbar');
        jQuery('body').addClass('bodytopmargin').removeClass('bodynomargin');
      } else {
        jQuery('#headnev').removeClass('navbar-fixed-top').addClass('topnavbar');
        jQuery('body').removeClass('bodytopmargin').addClass('bodynomargin');
      }
    });

    from custom.js