A jQuery plugin to get a textarea or inputs cursor x/y position.
JavaScript
Latest commit 4c47d25 Sep 17, 2016 @davidshariff committed on GitHub Update README.md
Permalink
Failed to load latest commit information.
LICENSE
README.md
jquery.jcursorpos.js
jquery.jcursorpos.min.js

README.md

jCursorPos

JCursorPos is a lightweight (3kb gzip), cross browser plugin to get the cursor x / y and top / left coordinates in a textarea or input element. Once initialized, the cursor x / y position will be updated on the element's data-* attribute, and optionally passed to a callback function.

Getting Started

To use, simply include jquery.jcursorpos.js and do the following:

$('textarea').jCursorPos({
      onChange: function(cursor) {

          // the source element where the cursor is active
          var el = $(this);

          // the x/y of the cursor relative to the document
          console.log(cursor.offset.left);
          console.log(cursor.offset.top);

          // the x/y of the cursor relative to the textarea
          console.log(cursor.position.left);
          console.log(cursor.position.top);

      }
});

The cursor position relative to the window will be returned, as well as the position of the cursor relative to the inside of the textarea or input element.

How to use?

A demo is available here.

An onChange callback is fired everytime the cursor moves, passing a cursor object as a function parameter. The cursor object contains the following properties:

offset top Y coordinate of the cursor from the document window
left X coordinate of the cursor from the document window
position top Y coordinate of the cursor from the source element
left X coordinate of the cursor from the source element

License

Copyright (c) 2013 David Shariff Licensed under the MIT license.