[Solved] bootstrap fixed nav in single page site links issue


What you’re trying to achieve here is impossible without Javascript.

You’ve changed the scrollTop but you need to do it after some milliseconds to get it working, e.g:

$(".nav a").click(function(){
  setTimeout(function() {
    $(window).scrollTop($(window).scrollTop() - 50);
  }, 10);
});

If you don’t want to wait those milliseconds, you can also prevent the default behavior and simulate it:

$(".nav a").click(function(e){
  e.preventDefault();
  var href = e.target.href, id = "#" + href.substring(href.indexOf("#") + 1);
  $(window).scrollTop($(id).offset().top - 50);
});

Now, if you prefer a completely no-javascript solution, you’ll need to workaround by putting a padding-top of 50px in each of your section tags, so the title will be visible in the way you want to.

1

solved bootstrap fixed nav in single page site links issue