JS library to get the xy coords of a textarea or input's caret


Javascript library which finds the top and left coordinates of the caret in a <textarea> or <input type="text">, in pixels. Useful for textarea autocompletes like GitHub or Twitter, or for single-line autocompletes like the name drop-down in Twitter or Facebook's search or the company dropdown on Google Finance.

Features include:
 * supports <textarea>s and <input type="text"> elements
 * pixel precision with any combination of paddings, margins, borders,
   heights vs. line-heights etc.
 * keyboard, mouse support and touch support
 * no dependencies whatsoever
 * browser compatibility: Chrome, Safari, Firefox, Opera, IE9+
 * supports any font family and size, as well as text-transforms
 * not confused by horizontal or vertical scrollbars in the textarea
 * supports hard returns, tabs (except on IE) and consecutive spaces in
   the text
 * correct position on lines longer than the columns in the text area
 * no problem getting the correct position when the input text is scrolled
   (i.e. the first visible character is no longer the first in the text)
 * no "ghost" position in the empty space at the end of a line when wrapping
   long words in a <textarea>
 * RTL (right-to-left) support

Upload more screenshots

Please help extend the collection of screenshots. Just make a screenshot and upload it here. You don't need to register or anything.

Upload a screenshot

Hint: upload an image here from your clipboard with Ctrl-V


Install this software package

If the package is available for the distribution you are currently using on your computer then install the software by clicking on…

Install libjs-textarea-caret