How do you scroll to an element that is within a scrollable div?

Question

I've seen scrollTo used for an entire page, but I'm looking to scroll content within just a div.

In the image, I have an element I want to scroll to. How to I bring the scroll to the top of the containing div (which already scrolls, I just want it to be automatic).

There is plenty of text below the highlighted element to facility scrolling.

Answer 1

You can set the scrollTop of the element which contains that element. And the value to set is actually the top position of that element which can be obtained using $(element).position().top .

So, the code you need is:

$j(scrollable_div).scrollTop($j(other_element).position().top)

NOTE: you made need to find the offset between other_element's containing element and the top of the page for it to scroll accurately.