Sticky navigation with smooth scrolling - jumping

Question

I'm having issues with insert and smooth scrolling. I just don't know enough about jQuery for troubleshooting. I use a smooth scroll snippet from Chris Coyer: http://css-tricks.com/snippets/jquery/smooth-scrolling/ . My page is here: http://clients.ekcetera.com/agivingchance .

Here are my problems:

• For any of the nav elements, it scrolls partially, and then moves to the location. I am pretty sure because I did not know how to account for the sticky heading, so I anchored a bit to take into account the height of the anchor. Thus, he gets to the anchor and stops, but then moves on to the appropriate view.
• When you click the "Back" button, it does not seem to always go to the right place - sometimes it is quite random. I think this is due to problem 1, and I hope she will solve it herself. It would even be nice for me to delete the browser history / back button, but, as I said, the JQuery wizard is not enough to know what to delete.

Any suggestions?

Thanks in advance!

Answer 1

1. Use this code from the Devin Sturgeon comment on Smooth Scrolling Posts. Plus I added a little subtraction to make up for your sticky headline. Tune in to sympathy.

// your functions go here $('a[href*=#]:not([href=#])').click(function() { if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') || location.hostname == this.hostname) { var target = $(this.hash); target = target.length ? target : $('[name=' + this.hash.slice(1) +']'); if (target.length) { $('html,body').animate({ scrollTop: target.offset().top - 181 }, 1000); return false; } } }); 

2. Move all your bindings to the actual item that you want to scroll.

(ref: http://css-tricks.com/snippets/jquery/smooth-scrolling/#comment-197181 )