how to scroll control to the top of screen

Question

Hi,

How do I scroll (ideally smooth scroll) down such that the specified control is at the top of the screen? (ie, how do I bring the screen down to the comment section such that the 'comments' title is at the top of the screen?)

Answer 1

Find here a solution: http://blog.freelancer-id.com/index.php/2009/03/26/scroll-window-smoothly-in-jquery

Answer 2

Like this:

$('html, body').animate({ scrollTop: $(something).offset().top });

Alternatively, you can use the ScrollTo plugin.

Answer 3

There is a ScrollTo plugin, that is pretty popular. With this is it simple, just:

$.scrollTo(...);

Answer 4

UPDATE

Check it out: http://jsbin.com/efafe/2

---

Using the jQuery animate() will create the smooth scrolling and the scrollTop property will get you to a specific point in the page. To scroll to a certain <div id="scroll-here">, you can do:

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

This will scroll to the <div id="scroll-here"> in 1s. You can customize .animate() to make it scroll to certain positions, scroll as fast/slow as you want, as well as supply a callback function after the scrolling is complete if you want to do something extra after you scroll to the desired place.

Hope this helps!