5

I'm looking for a way to retrieve the character position when moving the mouse pointer over a div containing text.

So basically, if this is the text:

The quick brown fox jumps over the lazy dog

and I move my mouse over the first 'b' (in 'brown'), then I would basically like to have the ability to return the position of 'b' in an mouseover event. (In this case, I would need to get the value 10, assuming starting at position 0.)

(O, and if it helps, I would be ok with having a solution for a monospaced font. And I don't really care too much about the character's 'value' at the given position. Like, when I move the value over the 'q', then I don't care to know if it's actually a 'q', but I would love to know that the mouse pointer is currently moving over the 5th character.)

Wilfred Springer
  • 10,869
  • 4
  • 55
  • 69

2 Answers2

2

It's really ugly, but you could use 

<span onmouseover="setPosition(...)"></span>

around every character in the <div>, with suitable JavaScript implementation of setPosition().

activout.se
  • 6,058
  • 4
  • 27
  • 37
0

That's an interesting question. It's a difficult one though, since you may have invisible characters (think formating, like 

 <b> some text </b> more text

for example, that's already 7 characters' offset in your file).

I think the easiest path towards a solution uses a Javascript method applied only to the displayed characters inside the div. Maybe a well-wrought regexp can do that.

Edit: no, do NOT use a regexp to do that. It's dangerous for your sanity.

Community
  • 1
  • 1
Kheldar
  • 5,361
  • 3
  • 34
  • 63