How do I set textarea scroll bar to bottom as a default?

javascript css scroll textarea
moesef picture moesef · Feb 7, 2012 · Viewed 96.3k times · Source

I have a textarea that is being dynamically reloaded as user input is being sent in. It refreshes itself every couple seconds. When the amount of text in this textarea exceeds the size of the textarea, a scroll bar appears. However the scroll bar isn't really usable because if you start scrolling down, a couple seconds later the textarea refreshes and brings the scroll bar right back up to the top. I want to set the scroll bar to by default show the bottom most text. Anyone have an idea of how to do so?

Answer

Will P. picture Will P. · Feb 7, 2012

pretty simple, in vanilla javascript:

var textarea = document.getElementById('textarea_id');
textarea.scrollTop = textarea.scrollHeight;

Related questions

Prevent BODY from scrolling when a modal is opened

I want my body to stop scrolling when using the mousewheel while the Modal (from http://twitter.github.com/bootstrap) on my website is opened. I've tried to call the piece of javascript below when the modal is opened but …

Read More
How can I make a div stick to the top of the screen once it's been scrolled to?

I would like to create a div, that is situated beneath a block of content but that once the page has been scrolled enough to contact its top boundary, becomes fixed in place and scrolls with the page.

Read More
Keep overflow div scrolled to bottom unless user scrolls up

I have a div that is only 300 pixels big and I want it to when the page loads scroll to the bottom of the content. This div has content dynamically added to it and needs to stay scrolled all the …

Read More