phpcodec Posted July 23, 2008 Share Posted July 23, 2008 So i have a textarea with lots of content and i wanted to make it auto scroll from the top to the bottom, how can i do this with javascript? Link to comment https://forums.phpfreaks.com/topic/116221-textarea-with-javascript/ Share on other sites More sharing options...
lemmin Posted July 23, 2008 Share Posted July 23, 2008 <script language="JScript"> function txtScroll() { txtTest.scrollTop = txtTest.scrollTop+1; setTimeout('txtScroll()', 100) } </script> <textarea id="txtTest" rows=5>TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text </textarea> Mess with the 100 number for speed. Link to comment https://forums.phpfreaks.com/topic/116221-textarea-with-javascript/#findComment-597970 Share on other sites More sharing options...
Psycho Posted July 23, 2008 Share Posted July 23, 2008 There's a small problem with that code in that once it starts - it never stops - even when the text area has reached the bottom of the text. That means it is continually running on the client's machine. I would suggest using scrollheight as a trigger for when the script can be exited (you can always restart the script if the user moved the slider). Of course scroll height will always be greater than scroll top because of the top and bottom scroll buttons, but this will at least exit the script shortly after it reaches the bottom: <html> <head> <script language="JScript"> function txtScroll(textareaID) { textareaObj = document.getElementById(textareaID); textareaObj.scrollTop = textareaObj.scrollTop+1; if (textareaObj.scrollTop < textareaObj.scrollHeight) { setTimeout('txtScroll(\''+textareaID+'\')', 10); } } </script> </head> <body> <textarea id="txtTest" rows=5 onclick="txtScroll(this.id)">TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text TEST Text </textarea> </body> </html> Link to comment https://forums.phpfreaks.com/topic/116221-textarea-with-javascript/#findComment-598080 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.