views:

43

answers:

1

I'm currently working on a WYSIWYG editor for a client (It's not like any other editor, it will also be able to insert drawings using HTML5) And I've been looking at and using several ways to insert content.

Ok, so I have a div with contentEditable set to "true", and I'm stuck on a way make the text a different size/font by inserting tags before and after to cursor, or something similar. I've tried using Design Mode with execcommand, but that didn't work. Can somebody help?

+1  A: 

You have some reading to do. If you're taking this on, be aware that it's a tricky and time-consuming task to write a WYSIWYG editor in JavaScript: there are many bugs, quirks and discrepancies between browsers and the fact that you're here asking such a general question on Stack Overflow at this stage doesn't bode well. Most of the browser makers have easily-found documentation on their implementations of designMode and contenteditable (see MDC, for example), so you could start there. To do things like inserting an element at the cursor, you'll also need to learn how to deal with Selections, DOM Level 2 Ranges and TextRanges in IE up to version 8. Finally, looking at the source code of some the popular editors such as TinyMCE and CKEditor may help; simpler, smaller editors (there's loads around) might be even more helpful.

Tim Down