Say the user is viewing a particular part of the page, when behind the scenes an auto update feature runs, and right above or below the user's screen some more content is added.

I have the id of the newly added content's div.

How can I smoothly scroll the user to the newly added div using jquery or plain javascript? Must work in all major browsers.

Say the user is viewing a particular part of the page, when behind the scenes an auto update feature runs, and right above or below the user's screen some more content is added.

I have the id of the newly added content's div.

How can I smoothly scroll the user to the newly added div using jquery or plain javascript? Must work in all major browsers.

• javascript
• jquery

3 Answers 3

Here's what I use for jQuery

$('html,body').animate({scrollTop: jQuery("#ID").offset().top},'slow');

I think, this should work...with jquery.

$(window).scroll($('#newly-added-elem').offset().top);

UPDATE: smooth scrolling can be achieved with this:

$('body').animate({scrollTop: $('#newly-added-elem').offset().top},'slow');

Use an anchor:

<a name="newelement">.... new element stuff here ...</a>

then change the page's URL to point at that new element:

http://example./yourpage.html#newelement