How to automatic scroll inline div without scrolling the whole page?

Question

I have a div as a container for a file view. This div has scrolling in y direction.

I want to automatically scroll the content inside this container div to a specific position when loading the page, but without to scroll the whole page. I have tried with <a name="scrollHere"> and location.hash = 'scrollHere'; but this scrolls the whole page.

Do you have any ideas?

Answer 1

Use scrollTop on the container element with a value calculated from the y position of the element inside the container.

Mozilla Element.scrollTop

stackoverflow: javascript-textarea-scrolltop

Answer 2

Using scrollTop requires that you know the position you are going to, and it could change as content changes. A possible solution is to add an anchor tag and call focus on it when the page loads, the browser takes care of scrolling it for you.

If you use Ext, you can use Element.scrollIntoView. otherwise, you can look at their source code for inspiration on how to do implement scrollIntoView.

http://www.extjs.com/deploy/dev/docs/source/Element.scroll-more.html#method-Ext.Element-scrollIntoView