Animate scroll to ID on page load

Pure javascript solution with scrollIntoView() function:

document.getElementById('title1').scrollIntoView({block: 'start', behavior: 'smooth'});

<h2 id="title1">Some title</h2>

P.S. 'smooth' parameter now works from Chrome 61 as julien_c mentioned in the comments.

You are only scrolling the height of your element. offset() returns the coordinates of an element relative to the document, and top param will give you the element's distance in pixels along the y-axis:

$("html, body").animate({ scrollTop: $('#title1').offset().top }, 1000);

And you can also add a delay to it:

$("html, body").delay(2000).animate({scrollTop: $('#title1').offset().top }, 2000);

Deprecation Notice: The jQuery.browser property was removed in jQuery 1.9. Visit the docs for more details: https://api.jquery.com/jQuery.browser/

$(jQuery.browser.webkit ? "body": "html").animate({ scrollTop: $('#title1').offset().top }, 1000);

Source: jQuery Animate Body Scroll For All Browsers