4

I am trying to find the current caret position (the blinking |) in x and y coordinates. Does anyone have a way of doing this? I really don't know where to get started.

I know this is possible in javascript, as there is a glitchy jQuery plugin for it, but I want to do it without jQuery.

More specifically, I am interested in mimicking the way Google Instant displays the #1 selection as grey text. I plan on doing this for both textfields and textareas by retrieving the caret position (like I mentioned above), then placing the text using absolute positioning. If someone has a better way to do it, let me know.

Thanks!

Gus
  • 1,905
  • 6
  • 23
  • 37

2 Answers2

1

I would say that you're better off putting the entire guessed string (including the text typed so far) as a background label div and make the input box transparent.

Positioning the input box and the div ought to be trivial. That way, you can make the label gray and it'll give the same effect.

Would that work?

EDIT: checked what google instant does. They have two input boxes positioned on top of each other and the guess is populated in the background input

sankargorthi
  • 369
  • 3
  • 21
  • Interesting. I think I'm going to have to do something different than what Instant does, though, because what they use isn't capable of placing that gray suggestion text in the middle of sentence, only at the very end. The option you described may word though, but I'm wondering if there's a more seamless way of doing it. – Gus Jan 28 '11 at 22:00
  • If the suggestion has content in the middle of the term typed in, you'd be better off showing it in a dropdown div ala google suggest. Or you'd have really confusing and difficult to maintain (codewise) interaction. Spotlight search(Mac os x) and desktop search(windows vista+) both do the same. – sankargorthi Jan 31 '11 at 17:45
-1

You need to watch out for mouse move events and get the coordinates from the move.

mP.
  • 18,002
  • 10
  • 71
  • 105