Взял этот визуальный редактор
http://tifftiff.de/contenteditable/editor.html
Спецификацию можно посмотреть там
http://tifftiff.de/contenteditable/
Привлекло малое количество кода.
Мне нубу в этом гораздо реальнее разобраться, чем копаться в 2-5 мб кода.
Засада с картинками.
1.) Если вставлять картинку через
exec
document.execCommand('insertImage', false, "/images/"+str)
Она встаёт в позицию курсора.
Но, я не осилил добавить ей
style="float:left"
2.) Если вставлять картинку через
object
var Con = document.getElementById('the_content_edit') //хватаемся за редактируемый DIV
var img = document.createElement('img') //созаём картику как объект
img.src="/content/localhost/images/"+str //где картинку сёрчить
img.style='float:left' //обтекание left
Так получается объект со стилем для обтекания. Но вставить его в позицию курсора я не смог.
Вроде бы надо инсертить "как дочерний объект".
Con.appendChild(img)
Так картика вылезает визуально после DIV. А по коду - внутри DIV (в конце).
- - - -
Хотелось бы:
добавить float:left первому варианту
или
вставить в позицию каретки второй вариант