javascript - Anchor slow scroll fixed header -
i want use smooth scroll anchors on page. therefore use following code:
<script> $(document).on('click', 'a', function(event){ event.preventdefault(); $('html, body').animate({ scrolltop: $( $.attr(this, 'href') ).offset().top }, 500); }); </script>
the problem have fixed header, height of 88px. when clicking on anchor, scrolls far.
how can extent code work correctly?
if know fixed header always have height of 88px, can add value final scroll position make space :)
$('html, body').animate({ scrolltop: $( $.attr(this, 'href') ).offset().top + 88 }, 500);
if fixed header height might change, want check it's outerheight , add offset. assuming fixed header's jquery object stored $fixedheader
:
$('html, body').animate({ scrolltop: $( $.attr(this, 'href') ).offset().top + $fixedheader.outerheight() }, 500);
Comments
Post a Comment