А можно установить координаты каретки в contenteditable блоке?

Question

[SilentImp]

Приятного дня.

А можно установить координаты каретки в contenteditable блоке?

Я имею в виду сдвиг в н пиксельный относительно чего то.

Answer 1

[un1t]

Если речь идет о том чтобы сохранить текущую позицию курсора и востановить ее, то я использовал следующий код
stackoverflow.com/a/3323835/562627

Answer 2

[Вадим]

<div class="edit" contenteditable>
текст
</div>

$(document).on('keyup', '.edit', function(e){
   insertCurrentPlace = ''; // ловим текущий тег
   caret = ''; // положение каретки
   caret = window.getSelection().anchorOffset;
   if (window.getSelection().anchorNode.nodeName == '#text') {
	insertCurrentPlace = window.getSelection().anchorNode.parentNode;
   } else {
	insertCurrentPlace = window.getSelection().anchorNode;
   }
   console.log(caret);
});

Answer 3

[SilentImp]

Нет, не о позиции курсора.
Задача: сделать тулбар с кнопками (полужирное начертание, крусивное начертание, выключка по формату …) который бегает (абсолютно позиционированный блок) за курсором в блоке с contenteditable во время редактирования. Но мне надо вычислить положение курсора относительно блока который редактируется.

Comments

[Сергей Протько]

Эм… а ничего что этот блок будет перекрывать текст? Это ж неудобно. Лучше сделать тянующуюся панельку, которую можно перетащить куда удобно.

[SilentImp]

Во-первых, он не обязательно должен перекрывать текст. Панель может например следовать за кареткой по высоте сбоку от текста.
Во-вторых, такое решение используется в iOS достаточно активно и не вызывает неудобств.
Вопрос не в том надо ли это делать. Это решает специалист по интерфейсам. Вопрос в том могу ли я это реализовать и как именно это сделать.

[prineside]

Не пробовал, но почему бы не:
1. Установить моноширинный шрифт заданного размера
2. Посчитать, сколько символ пикселей в ширину
3. Получить позицию в строке (символы) и умножить на ширину символа