MooTools - Simple HTML5 Editor

<button id=bold class=bold>bold</button>
<button id=italic class=italic>italic</button>
<button id=underline>underline</button>
<button id=undo class=undo>undo</button>
<button id=redo>redo</button>
<button id=save>save</button>
<div id=edit class=textarea contenteditable=true designmode=on></div>

<script>
window.addEvent('domready', function(){

function doExec(fx, extra) {
document.execCommand(fx, false, extra);
showHTML();
}

$('bold').addEvents({'click': function(e){
doExec('bold', '');
}});

$('italic').addEvents({'click': function(e){
doExec('italic', '');
}});

$('underline').addEvents({'click': function(e){
doExec('underline', '');
}});

$('undo').addEvents({'click': function(e){
doExec('undo', '');
}});


$('redo').addEvents({'click': function(e){
doExec('redo', '');
}});

$('save').addEvents({'click': function(e){
var myContent = $('edit').get('html');
$('html').set('text',myContent);
}});

});
</script>

Related Posts

Mootools - HTML5 Editor, MooTools HTML5 Upload