<style type="text/css">
.abc{
	background: #ff0;
	border: 0px;
	display: block;
}
</style>
<div style="background:#fee; width: 200px; height: 50px;"></div>
<div style="background:#efe; width:200px;" id="s">
	<br /><br />Presidente Lula<br />Mensalo<br />Microsoft<br />Firefox
</div>

<form id="f" style="display:inline;">
	<input type="button" id="edit" value="Editar" />
	<input type="button" id="cancel" value="Cancelar" />
</form>

<script type="text/javascript">
//<![CDATA[

function stripTags(s){
	return s.replace(/<.*?>/g, "");
}

var t = new TagEditor(), tag = document.getElementById("s");
//t.addTag(tagRef, multiLine, classe, filtro, nameNoForm);
var o = t.addTag(tag, true, "abc", stripTags, "nomeDoCampo");
o.onEdit = function(input){
	//alert("Editar");
}
o.onCancel = function(input){
	//alert("Cancelou");
}
o.onSave = function(input){
	//alert("Salvou");
}
o.onAfterSave = function(div){
	if(div.offsetHeight < 60)
		div.style.height = "60px";
}



var c = document.getElementById("cancel"), e = document.getElementById("edit");
c.style.display = "none";
e.onclick = function(){
	var s = this.value == "Salvar", st = c.style;
	s ? (o.save(), st.display = "none") : (o.edit(), st.display = "");
	this.value = s ? "Editar" : "Salvar";
}
c.onclick = function(){
	o.cancel();
	this.style.display = "none", e.value = "Editar";
}

//]]>
</script>