jquery - Cannot use scrollTo offset when using window.location.hash -


i have single page site position: fixed; header containing main nav. i'm using this plugin smooth scroll each section via main nav. because of fixed header need set offset = height of header. works fine using initialisation:

$('.nav-main a').click(function(e) {     e.preventdefault();     var anchorlocation = $(this).attr('href');     $.scrollto(anchorlocation, 700, {         offset: -86     }); }); 

but need url include section id e.g. http://domainname.com/#about each link has in it's href e.g. <a href="#about">about</a> use this:

$('.nav-main a').click(function(e) {     e.preventdefault();     var anchorlocation = $(this).attr('href');     $.scrollto(anchorlocation, 700, {         offset: -86,         onafter: function() {              window.location.hash = anchorlocation;         }     }); }); 

so fixes url screws header in disappears once smooth scroll has finished come view if scroll again , offset doesn't work. ideas?

edit

someone posted below solution removed works in terms of not having use plugin offset works in webkit browsers (chrome, safari) in ie 8/9 & firefox once scrolling animation has stopped honour offset millisecond snap top of viewport.

var headerheight = $('[role="banner"]').outerheight() -1;  $('.nav-main a').click(function(e) {     e.preventdefault();     scrolltoid($(this).attr('href')); });  function scrolltoid(id){     $('html, body').animate({         scrolltop: $(id).offset().top - headerheight     }, 700, function() {         window.location.hash = id;     }); } 


Comments

Popular posts from this blog

linux - xterm copying to CLIPBOARD using copy-selection causes automatic updating of CLIPBOARD upon mouse selection -

c++ - qgraphicsview horizontal scrolling always has a vertical delta -