Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   first-letter и contenteditable (https://javascript.ru/forum/misc/12318-first-letter-i-contenteditable.html)

SilentImp 12.10.2010 01:50

first-letter и contenteditable
 
Приятного дня.

Вопрос: кто то пытался подружить блок с псевдоклассом :first-letter
Например:

.message:first-letter{ 
                    color:#c00; 
                    font:bold 18px/18px Georgia,serif; 
                    letter-spacing:1px; 
                    }


и атрибут contenteditable?
При совместном использовании первая буква не редактируется. Webkit вообще норовит зависнуть.

Если применить contentEditable ко всем дочерним элементам (.message>*,.message), то в принципе оно конечно редактируется. Но ведет себя совершенно не адекватно. В частности — не обновляется эта самая first-letter буква.

Кто то может подсказать решение?

SilentImp 15.10.2010 13:50

Количество идей поражает воображение )
Ладно, учитывая то, какую генерирует разметку контентедитебл ... с ним все равно надо чего то думать.

tenshi 15.10.2010 16:21

а что ты пытаешься сделать-то?

SilentImp 15.10.2010 19:11

Простенький редактор сообщения.
В основном "for fun" и что бы понять как работать с conteneditable и с какими подводными камнями я столкнусь в процессе.

Есть div с текстом.
Редактируем минимально то, что внутри (по сути текст + <br>) и сохраняем или отменяем.

Вот только если на блок навесить :first-letter (Что бы большая и красненькая), то редактировать текст (а конкретно первую букву) в блоке станет затруднительно. Если применить conteneditable к дочерним элементам (вооще то он должен быть inherit по умолчанию, но наверное скрытая разметка, которая генерируется :first-letter — случай особый) то редактироваться оно в принципе будет. Но с отображением этого процесса все равно проблема.

Как решить пока не знаю.
Проблема явно кроссбраузерна.

tenshi 15.10.2010 20:34

ну, если очень надо, то можно отслеживать изменение текста и добавлять специальные элементы для первых букв.

а вообще у меня есть движок для динамической подсветки синтаксиса, на котором можно сделать это и многое другое: http://mojura.110mb.com/i-component/...ield-text.html

SilentImp 15.10.2010 22:49

Спасибо, но не имеет особого смысла эмулировать работу :first-letter
Я просто надеялся, что есть некий способ подружить contenteditable с этим псевдоселектором, которые я не вижу и которые не могу нагуглить.

Спасибо за ссылку на движек ... постараюсь чему нибудь научится из его кода.

Тоесть, насколько я понимаю, никаких хитрых хаков решающих проблему нет?

tenshi 15.10.2010 22:53

хз.. редактирование в браузерах реализовано сейчас через задницу и что-то как-то не видно особых подвижек в этой области =(

SilentImp 15.10.2010 23:17

Ладно. Буду думать. У меня сейчас еще более забавные особенности наблюдаются. При переводе строки генерируется совершенно идиотская разметка с использованием врапперов. В результате стал отлавливать keydown, keyCode 13 (enter), блокировать событие по умолчанию и добавлять document.execCommand("insertHTML",false,"<br/>");
На этом все браузеры кроме opera успокоились. Opera же упорно добавляет в div контейнер <p><br/></p>. Сижу вот соображаю что с этой бедой делать.
Честно говоря редактирование в браузерах действительно поражает своей реализацией воображение.

tenshi 15.10.2010 23:34

я по keypress перехватываю во всех браузерах, вставляю бр-ку и ставлю выделение после него. плюс для оперы вставляю пустой текстовый узел перед ним

SilentImp 15.10.2010 23:51

А зачем пустой текстовый узел?


Часовой пояс GMT +3, время: 15:34.