<nav>Navigation</nav>

<div id="element"><a href="#element">Link</a></div>

body {
  height: 1000px;
  padding-top: 200px;
}
nav {
  width: 100%;
  height: 80px;
  position: fixed;
  top: 0;
  left: 0;
  border-bottom: 3px solid green;
}

$(document).ready(function() {
  /* $("a[href^='#']").click(function() {
    event.preventDefault();

    var _href = $(this).attr("href");
    $("html, body").animate({
      scrollTop: $(_href).offset().top + 100 + "px"
    });
    return false;
  });*/

  $("body").on("click", '[href*="#"]', function(e) {
    var fixed_offset = 80;
    $("html,body")
      .stop()
      .animate(
        {
          scrollTop: $(this.hash).offset().top - fixed_offset
        },
        300
      );
    e.preventDefault();
  });
});