Получить положение письма при наведении

Question

Каждая буква не имеет своего собственного элемента-обертки, все внутри абзаца.

И мне интересно, смогу ли я получить положение буквы в строке, когда наведу курсор мыши на родительский элемент?

Например: <p>The quick brown fox jumps over the lazy dog</p> имеет innerText.length = 43, если я наведу курсор на f, он должен вернуть 16.

Есть ли способ сделать это?

Заранее спасибо!

Answer 1

Опции для вас:

1. Для использования Canvas (HTML5) и, в частности, его context.measureText(text).width.Но это даст вам позицию в однострочном тексте.
2. Чтобы использовать курсор / диапазон в contenteditable, см. Получить позицию каретки (курсора) в области contentEditable, содержащей, например, HTML-содержимое .

Answer 2

Вы должны будете поместить каждое письмо в свое <span />.http://letteringjs.com/ может быть полезно для вас, в зависимости от того, что вы пытаетесь сделать.