Alex Alex - 6 months ago 19
jQuery Question

jQuery scroll to anchor not working correctly

I have the the following link: http://www.alessandrosantese.com/test/aldemair-productions/project.html

and I am using this to scroll to a specific div with an id:

$('.project-nav a').on('click', function(e){
e.preventDefault();

var anchor = $(this).attr('data-id'),
el = $('#' + anchor);
$('html, body').animate({ scrollTop: el.offset().top}, 500);

});


it works almost right, it doesn't scroll at a correct location, they all seem to be incorrect.

If you click details you wil be scrolled just above cast for example.

Answer

You should try:

 $('html, body').animate({ scrollTop: el.offset().top - $('header.close').height()}, 500);

The scrolling is working correctly. If you hide the header, you will see that 'Details' is perfectly at the top of the window...