Edit Question - KnowledgeHub

Title Body

I have a page with a very long textarea used for editing large amounts of texts. Normally, as you type, when the caret approaches the bottom of the textarea, the page will automatically scroll to keep the caret always within the viewport (Firefox will scroll by a single line at a time, Chrome will scroll the caret into the center of the viewport). My problem comes from the fact that I am programmatically changing the contents of the text area based on what the user types. In some cases this involves adding extra content, thus pushing the caret out of view. As soon as the user hits a key, the autoscroll kicks in and the caret is scrolled into view -- but not before, so as the user is typing they lose sight of the caret. I had hoped I could simply trigger key events on the textarea for the browser to autoscroll, but triggered events don't fully emulate user behavior and I do not get a response. The only solution I can see now is to try to get the XY coordinates of the caret by: Finding the character position of the caret. Building a div that mirrors the content of the textarea with a marker at the caret position. Measuring the position of the marker. Is there a simpler way to do this?

Tags (comma-separated) Cancel