前提:/Public/Biaoqing/Face/ 下存表情图片:eg:1.gif。默认有75个表情,每行15个javascript
1.Html:css
加载:java
jquery
app
触发:ide
测试
this
2.Jquery:url
function emotion(_obj) {
var assign='textareaComment'; //给这个控件赋值
var path='../Public/Biaoqing/Face/'; //表情存放的路径
var id='facebox'; //表情盒子的ID
var tip= 'em_';
var strFace,labFace;
if($('#'+id).length<=0){
strFace = '
'
for(var i=1; i<=75; i++){
labFace = '['+tip+i+']';
strFace += '
';if( i % 15 == 0 ) strFace += '
';}
strFace += '
$(_obj).parent().append(strFace);
var offset = $(_obj).position();
var top = offset.top + $(_obj).outerHeight();
$('#'+id).css('top',top);
$('#'+id).css('left',offset.left);
$('#'+id).toggle();
}
}
/*插入表情*/
function instBq(_id,_bq){
var obj = document.getElementById(_id);
obj.focus();
var leng=obj.value.length;
var charvalue=_bq;
if(typeof document.selection !="undefined") //ie
{
var r =document.selection.createRange();
r.text = charvalue;
}
else //firefox
{
obj.value=obj.value.substr(0,obj.selectionStart)+ charvalue +obj.value.substring(obj.selectionStart,leng);
}
var id='facebox'; //表情盒子的ID
$('#'+id).hide();
$('#'+id).remove();
}
spa
3.Css(say.css):
.qqFace{margin-top:4px;background:#fff;padding:2px;border:1px #dfe6f6 solid;}
.qqFace table td{padding:0px;}
.qqFace table td img{cursor:pointer;border:1px #fff solid;}
.qqFace table td img:hover{border:1px #0066cc solid;}
span.emotion {
background: url("../images/icon.gif") no-repeat scroll 2px 0 transparent;
cursor: pointer;
height: 20px;
padding-left: 24px;
width: 42px;
}
span.emotion:hover{
background-position: 2px -30px;
}
.tbtnarea{margin:6px 0 0}
.ly textarea,.ddreply textarea{border:1px solid #dddddd;resize: none}