Smooth scroll to div id jQuery
You need to animate the html, body
DEMO http://jsfiddle.net/kevinPHPkevin/8tLdq/1/
$("#button").click(function() { $('html, body').animate({ scrollTop: $("#myDiv").offset().top }, 2000);});
If you want to override standard href-id navigation on the page without changing the HTML markup for smooth scrolling, use this (example):
// handle links with @href started with '#' only$(document).on('click', 'a[href^="#"]', function(e) { // target element id var id = $(this).attr('href'); // target element var $id = $(id); if ($id.length === 0) { return; } // prevent standard hash navigation (avoid blinking in IE) e.preventDefault(); // top position relative to the document var pos = $id.offset().top; // animated top scrolling $('body, html').animate({scrollTop: pos});});
here is my 2 cents:
Javascript:
$('.scroll').click(function() { $('body').animate({ scrollTop: eval($('#' + $(this).attr('target')).offset().top - 70) }, 1000);});Html:
<a class="scroll" target="contact">Contact</a>and the target:
<h2 id="contact">Contact</h2>