Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to have a textarea to keep scrolled to the bottom when updated

My problem is a bit off the cuff here, so I'll try to explain this best I can.

I have a text area, having css of #object{overflow:hidden;resize:none;}. I am trying to prevent it from spawning scroll bar while also resizing itself. This textarea is synced with an external script's console meaning it updates. By default however, it will stay at the top unless you highlight text, dragging off to the bottom of the element. This would be the only way to scroll down other than with arrow keys, naturally.

Programmatically, is there any way to keep the text area down to the bottom upon updating? It would be nice to have it auto-scroll to accommodate its use case.

like image 623
TERMtm Avatar asked Sep 10 '11 16:09

TERMtm


People also ask

How do I scroll to the bottom of textarea?

to select the textarea element with getElementById . Then we set the textarea. scrollTop property to the textarea. scrollHeight value to scroll the textarea to the bottom of it.

How do I keep my Div scrolled to the bottom?

use css position top keep it at the bottom {position : relative; bottom:0;} . Remove the css property once the user has scroll.

How do you make the element not move when scrolling?

position:fixed; An element with fixed position is positioned relative to the browser window. It will not move even if the window is scrolled. Show activity on this post. Now, it should not scroll with the rest of the page or the parent element.

How do I enable scroll disabled in textarea?

the easiest way would be to use "readonly" instead. another way would be to use a fixed-height div will overflow:scroll that looks like a textarea but isn't.


1 Answers

You can do it by javascript. Set the scrollTop property of text area with scrollHeight property like below:

document.getElementById("textarea").scrollTop = document.getElementById("textarea").scrollHeight 
like image 140
Ujjwal Manandhar Avatar answered Sep 20 '22 10:09

Ujjwal Manandhar