testerix testerix - 1 year ago 130
Javascript Question

Bootstrap - sticky/fixed navbar when scroll

I’d like to create a navbar like this one: http://bartiistudio.tk/noxilie/onepage/index.html

Well, I use stickUp jQuery script but my navbar doesn’t work Wery well. I don’t know how to fix it.

And here is jsfiddle: http://jsfiddle.net/52VtD/792/

stickUp code:

jQuery(function($) {
$(document).ready( function() {
//enabling stickUp on the '.navbar-wrapper' class

Answer Source

If all your problem is the navbar-wrapper not occupying the full width. You just need to set it width:100%. The stickUp changed the position of the navbar from relative to fixed so that caused the problem.

If all you need to do is just stick the navbar on top why not create your own script.

It's fun and easy :D

$(document).ready( function() {
    var $stick = $('.navbar-wrapper');

        var scrollTop = $(this).scrollTop();

        if(scrollTop >= $stick.offset().top){

See this jsfiddle

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download