arquivo index.php
<script>
function smile(smile) {
editCtl.document.write("<img src=\"../../../images/emotions/"+smile+".gif\" width=\"20\" height=\"20\" border=\"0\">");
}
function abre_smiles(){
window.open('../../padrao/pop/emotions.php','acao','toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no,resizable=no,top=25,left=25,width=180,height=210');
}
</script>
<?php
if(!$comentario and !$nome){
?>
<table width="454" border="1" cellpadding="0" cellspacing="0" bordercolor="<?=$tema_cor_borda; ?>">
<form method="post" name="comentario">
<tr>
<td colspan="4" align="center" bordercolor="<?=$tema_cor_fundo; ?>" bgcolor="<?=$tema_cor_fundo; ?>"> Fazer comentário: </td>
</tr>
<tr>
<td colspan="4" align="center" bordercolor="<?=$tema_cor_fundo; ?>" bgcolor="<?=$tema_cor_fundo; ?>">
<br>
Seu nome:
<input name="comentarios_dono" type="text" id="comentarios_dono" size="35" maxlength="20">
<br>
Seu site:
<input name="comentarios_site" type="text" id="comentarios_site" value="http://" size="37" maxlength="100">
<br>
<br>
</td>
</tr>
<tr>
<td width="10" align="center" bordercolor="<?=$tema_cor_fundo; ?>" bgcolor="<?=$tema_cor_fundo; ?>">
</td>
<td align="center" bordercolor="<?=$tema_cor_fundo; ?>" bgcolor="ffffff">
<a href="javascript:abre_smiles();"><img src="../../../images/emotions/smile.gif" width="20" height="20" border="0"></a>
<script>
var buttons=new Array(25,25,25,25,25,25,4,25,25,25,25,4,25,25,25);
var action=new Array("bold","italic","underline","justifyleft","justifycenter","justifyright","","create","cut","copy","paste","","insertunorderedlist","outdent","indent");
var tooltip=new Array(L_BOLD,L_ITALIC,L_UNDERLINE,L_JUSLEFT,L_JUSCENTER,L_JUSRIGHT,"",L_BLANK,L_CUT,L_COPY,L_PASTE,"",L_LIST,L_OUTDENT,L_INDENT);
drawToolbar("/images/botoes/toolbar.gif", 412, buttons, action, tooltip,0, null);
</script>
</td>
<td align="center" bordercolor="<?=$tema_cor_fundo; ?>" bgcolor="#FFFFFF"><select name="select" id="zoom" STYLE="font:8pt arial;" onChange="editCtl.document.body.style.zoom=zoom.options[zoom.selectedIndex].value">
<option value="1.75">175%</option>
<option value="1.50">150%</option>
<option value="1.25">125%</option>
<option value="1" selected>100%</option>
<option value=".75">75%</option>
<option value=".50">50%</option>
<option value=".20">25%</option>
</select>
</td>
<td width="10" align="center" bordercolor="<?=$tema_cor_fundo; ?>" bgcolor="<?=$tema_cor_fundo; ?>">
</td>
</tr>
<tr>
<td colspan="4" align="center" bordercolor="<?=$tema_cor_fundo; ?>" bgcolor="<?=$tema_cor_fundo; ?>">
<input name="comentario" type="hidden" id="comentario" value="">
<iframe name=editCtl id=editCtl
width=424 height="200" marginwidth=0 marginheight=0 frameborder2=0
onBeforeDeactivate='editActivated=true' onActivate='editActivated=false'>
</iframe>
</td>
</tr>
<tr>
<td colspan="4" align="center" bordercolor="<?=$tema_cor_fundo; ?>" bgcolor="<?=$tema_cor_fundo; ?>">
<img src="../../../images/botoes/azu_enviar.gif" width="46" height="19" onClick="javascript:enviar();" class="linkmao">
<script>
initEditor();
editCtl.document.body.innerHTML=plainmsg.innerHTML;
</SCRIPT>
</td>
</tr></form>
</table>
<?php
}//if(!$comentario and !$nome)
else{
?>
<br>
<?php
}
?>arquivo js_editor.js
var L_BOLD = "Negrito";
var L_ITALIC = "Itálico";
var L_UNDERLINE = "Sublinhado";
var L_JUSLEFT = "Alinhado à esquerda";
var L_JUSCENTER = "Centralizado";
var L_JUSRIGHT = "Alinhado à direita";
var L_BLANK = "Nova descrição";
var L_CUT = "Recortar";
var L_COPY = "Copiar";
var L_PASTE = "Colar";
var L_LIST = "Marcador";
var L_OUTDENT = "Alinhar à direita";
var L_INDENT = "Alinhar à esquerda";
var L_NPAGE_CONFIRM = "Esta ação apagará todo o conteúdo de sua descrição. Deseja continuar?";
var editMode=false;
var selectedLink, sel, rng, selOK, editActivated, lastWhat;
function initEditor(){
editCtl.document.designMode="On";
editCtl.document.open();
editCtl.document.write("<BODY STYLE='font:10pt arial;' oncontextmenu='return false'>");
editCtl.document.close();
setMode(true);
}
function setMode(newMode) {
if (newMode==editMode) return;
editMode = newMode;
if ( editMode ){
editCtl.document.body.style.font = "10pt arial";
editCtl.document.body.style.backgroundColor = "#FFFFFF";
editCtl.document.body.innerHTML=editCtl.document.body.innerText;
document.all.zoom.disabled = false;
editCtl.document.body.style.zoom=document.all.zoom.options[document.all.zoom.selectedIndex].value;
} else {
editCtl.document.body.style.font = "10pt courier";
editCtl.document.body.style.backgroundColor = "#F4F4F4";
editCtl.document.body.innerText=editCtl.document.body.innerHTML;
document.all.zoom.disabled = true;
}
editCtl.document.body.style.zoom=1;
}
function drawToolbar(img, width, buttons, action, tooltip, offset, bgSpans, defColors){
var left=offset,s=""
for ( var i=0; i<buttons.length; i++ ) {
if (bgSpans != null && bgSpans[i] != "") s+= "<span id="+bgSpans[i]+" style='background-color:"+defColors[i]+"'>";
s+="<span style='position:relative;height:25;width: " + buttons[i] + "'>"+
"<span style='position:absolute;margin:0px;padding:0;height:25;top:0;left:0;width:" + (buttons[i]) + ";clip:rect(0 "+buttons[i]+" 25 "+0+");overflow:hidden'>"+
"<img border=0 SRC='"+img+"' STYLE='position:absolute;top:0;left:-" + left + "' WIDTH="+width+" HEIGHT=50"
if (buttons[i]!=4) {
s+=" onmouseover='this.style.top=-25' onmouseout='this.style.top=0' onClick=\""+
"buttonPress('" + action[i] + "');this.style.top=0\" "+
"title=\"" + tooltip[i] + "\"";
}
s+="></span></span>";
if (bgSpans != null && bgSpans[i] != "") s+= "</span>";
left+=buttons[i]
}
document.write(s)
}
function saveSelection(){
if ( editActivated ){
sel = editCtl.document.selection;
rng = sel.createRange();
}
}
function buttonPress(what) {
if (!editMode) return;
lastWhat = what;
saveSelection();
switch(what){
case "create":
if ( confirm(L_NPAGE_CONFIRM) ) {
initEditor();
}
break;
default:
editCtl.document.execCommand(what);
editCtl.focus();
}
}arquivo ./pop/emotions.php
<link href="../../../sys/css_pop2.css" rel="stylesheet" type="text/css">
<script language="javascript">
function add_smilie(code)
{
opener.editCtl.document.write("<img src=\"../../../images/emotions/"+code+".gif\" width=\"20\" height=\"20\" border=\"0\">");
//opener.document.REPLIER.Post.value += ' ' + code + ' ';
}
</script>
<title>Emotions</title><table border="0" align='center' cellpadding='0' cellspacing="0">
<tr align='center'>
<td width="50" height="30"><a href="javascript:add_smilie('huh')"><img src="../../../images/emotions/huh.gif" alt='smilie' width="20" height="20" border='0' /></a> </td>
<td width="50" height="30"><a href="javascript:add_smilie('ohmy')"><img src="../../../images/emotions/ohmy.gif" alt='smilie' width="20" height="20" border='0' /></a> </td>
<td width="50" height="30"><a href="javascript:add_smilie('wink)"><img src="../../../images/emotions/wink.gif" alt='smilie' width="20" height="20" border='0' /></a> </td>
</tr>
<tr align='center'>
<td height="30"><a href="javascript:add_smilie('tongue')"><img src="../../../images/emotions/tongue.gif" alt='smilie' width="20" height="20" border='0' /></a> </td>
<td><a href="javascript:add_smilie('biggrin')"><img src="../../../images/emotions/biggrin.gif" alt='smilie' width="20" height="20" border='0' /></a> </td>
<td><a href="javascript:add_smilie('laugh')"><img src="../../../images/emotions/laugh.gif" alt='smilie' width="20" height="20" border='0' /></a> </td>
</tr>
<tr align='center'>
<td height="30"><a href="javascript:add_smilie('cool')"><img src="../../../images/emotions/cool.gif" alt='smilie' width="20" height="20" border='0' /></a> </td>
<td><a href="javascript:add_smilie('rolleyes')"><img src="../../../images/emotions/rolleyes.gif" alt='smilie' width="20" height="20" border='0' /></a> </td>
<td><a href="javascript:add_smilie('dry')"><img src="../../../images/emotions/dry.gif" alt='smilie' width="20" height="20" border='0' /></a> </td>
</tr>
<tr align='center'>
<td height="30"><a href="javascript:add_smilie('smile')"><img src="../../../images/emotions/smile.gif" alt='smilie' width="20" height="20" border='0' /></a> </td>
<td><a href="javascript:add_smilie('mad')"><img src="../../../images/emotions/mad.gif" alt='smilie' width="20" height="20" border='0' /></a> </td>
<td><a href="javascript:add_smilie('sad')"><img src="../../../images/emotions/sad.gif" alt='smilie' width="20" height="20" border='0' /></a> </td>
</tr>
<tr align='center'>
<td height="30"><a href="javascript:add_smilie('unsure')"><img src="../../../images/emotions/unsure.gif" alt='smilie' width="20" height="20" border='0' /></a> </td>
<td><a href="javascript:add_smilie('wacko')"><img src="../../../images/emotions/wacko.gif" alt='smilie' width="20" height="20" border='0' /></a> </td>
<td><a href="javascript:add_smilie('blink')"><img src="../../../images/emotions/blink.gif" alt='smilie' width="20" height="20" border='0' /></a> </td>
</tr>
<tr align='center'>
<td height="30"><a href="javascript:add_smilie('ph34r')"><img src="../../../images/emotions/ph34r.gif" alt='smilie' width="20" height="20" border='0' /></a> </td>
<td><a href="javascript:add_smilie('thumbs_down')"><img src="../../../images/emotions/thumbs_down.gif" alt='smilie' width="19" height="19" border='0' /></a> </td>
<td><a href="javascript:add_smilie('thumbs_up')"><img src="../../../images/emotions/thumbs_up.gif" alt='smilie' width="19" height="19" border='0' /></a> </td>
</tr>
<tr align='center'>
<td height="30" colspan="3"><img src="../../../images/botoes/fechar.gif" width="58" height="14" onclick="javascript:window.close();" class="linkmao"></td>
</tr>
</table>pronto.... olha um exemplo:
CLIQUE AQUI
