Scroll an input box to the cursor position in javascript

Question

I've written a simple JS function that places the cursor at the end of the contents of an input box when it receives focus (the most common action in the box being to append). I haven't checked in IE, but when there is more text than is visible, even moving the cursor to the end of input doesn't scroll the view to the end of input in firefox 3.6.

Any idea how to do this?

P.S. And no I'm not using JQuery, nor is it an option ;)

Found a solution here using different wording (caret instead of cursor)

Answer 1

You can scroll by assigning to the textarea's scrollTop property:

// scroll to bottom
elt.scrollTop = elt.scrollHeight;

Firefox and Safari also offer scrollByLines, and IE has doScroll, but the scrollTop property is cross-browser and simpler to use.

Personally, I don't like it when the cursor is moved for me to the end of a textarea. If I want it at the end, it takes a fraction of a second to do it my self. It takes around a second to move the cursor from the end to somewhere in the middle (the end is a larger target, thus takes less time to hit). Unless the textarea has a special purpose, I wouldn't bother with the append-on-focus function.