新模板系统留言表情插件（增强版）发布！

<< [专题]blogbus模板共享搜集 7 | 首页 | 珍爱生命，远离yupoo！（内文无营养，慎入） >>

该日志由 jiee @ 13:12:55 发布,Tag: blogbus模板评论表情

这次发布的留言表情插件是我重新构思的，功能上也更加符合用户需求，表情的自定义也更加方便。下面来讲下实现方法。

Header代码块：

把上面这些代码放在header代码块中即可，自定义方法请对照看下图注。

注意看下图中的红线框部分，/* */ 当中的代码表示这部分代码不起作用，默认代码中，有两处代码（红线框处）被故意设置成不起作用。

默认表情效果

下面来讲下自定义表情的方法，仍然是上面的代码，需要发动的地方不多。

去掉两处红线框处的代码 /* */ , 这样就启用了自定义的表情，简单吧？！下面看下我自带的自定义表情效果。

自带的是悠嘻猴的表情

可能大家不想要悠嘻猴表情，下面再来看下如何更换自定义表情。

arrEmotion = ["http://www.keaiq.com/pic8/xilie/62qq/biaoqing002.gif", "http://www.keaiq.com/pic8/xilie/62qq/biaoqing003.gif", "http://www.keaiq.com/pic8/xilie/62qq/biaoqing004.gif", "http://www.keaiq.com/pic8/xilie/62qq/biaoqing005.gif", "http://www.keaiq.com/pic8/xilie/62qq/biaoqing009.gif", "http://www.keaiq.com/pic8/xilie/62qq/biaoqing015.gif", "http://www.keaiq.com/pic8/xilie/62qq/biaoqing020.gif", "http://www.keaiq.com/pic8/xilie/62qq/biaoqing032.gif", "http://www.keaiq.com/pic8/xilie/62qq/biaoqing038.gif", "http://www.keaiq.com/pic8/xilie/62qq/biaoqing057.gif"];

修改这里的代码就可以了，代码的结构是这样的，

arrEmotion = ["图片网址1",
"图片网址2",
"图片网址3",
"图片网址4",
"图片网址5"];

图片网址的数目没有作规定，但最好不要超过20个，因为表情过多也不是件好事……请注意按照格式添加图片网址，最后一个图片网址后面没有逗号！

另外还有一部分涉及到css的知识，我就不解释了，如果在应用过程中有什么问题，请留言给我。

完稿时间：2008-04-10 13:38:43

分类于：模板技巧您可以: 阅读全文 () | 评论 (30) | 引用 (3)

[avatar:41]还有一个问题是怎么把评论EMAIL旁的您将收到博主的回复邮件这句话删除或改成其他的字呢？
头像我添加失败了按照你的步骤我的BLOG出现2套头像我的是新模板！谢谢了！
jiee 回复 quietay 说：
.emailnotice {display: none; }
加到css的最后就可以了

头像那个功能过段时间有空了，会重新写代码的，目前这个不太好用
(2008-06-23 10:45:10)

quietay (http://quietay.blogbus.com/) 发表于 2008-06-23 03:49:58 [回复]
[avatar:41]请问一下如何把日志中的引用地址和横幅广告去除呢？谢谢！
jiee 回复 quietay 说：
在css代码的最后添加下面的代码：
.tb_url,.postBody table {display: none;}

另，希望你在日志中引用的我博客中那些代码，都能注明来源
(2008-06-23 10:43:54)

quietay (http://quietay.blogbus.com/) 发表于 2008-06-23 01:46:00 [回复]
[avatar:49]成功啦啊哈哈

vincy_ven (http://kumiko2v.blogbus.com) 发表于 2008-05-15 16:28:23 [回复]
[avatar:41]万恶你怎一个强字了得。学习中。

小迷 () 发表于 2008-05-10 00:30:34 [回复]
[avatar:40]在此谢过了！Thank you very much!

Ericwss (http://jiale.blogbus.com) 发表于 2008-05-07 13:33:53 [回复]
[avatar:40]谢谢你的代码-v- 已经用上了
有个小问题在评论显示的那个module里面这些表情是显示不了的?
另外如果图片不一样大有没有办法resize处理一下..我发现我从ycool弄过来的兔斯基一套图片居然尺寸有点不一样的...
jiee 回复 Daniel 说：
虽然可以，但搞出来的效果不一定好，所以你还是尽量选择相同大小的图片吧……
(2008-05-12 00:19:20)

Daniel (http://danielfree.blogbus.com) 发表于 2008-05-07 10:24:29 [回复]
[avatar:46]不好意思。。。。发现没图标了，哈哈，多谢

WILLER (http://willerwang.blogbus.com) 发表于 2008-04-23 21:32:10 [回复]
[avatar:46]兄弟，请问一下，如果用这个代码，要在首页显示图标该怎么做？现在首页的评论图标就是一片代码
jiee 回复 WILLER 说：
首页的代码会在页面完全加载后，由js将它们隐藏起来……
(2008-04-23 22:03:15)

WILLER (http://willerwang.blogbus.com) 发表于 2008-04-23 21:31:01 [回复]
[avatar:40]呵呵
似乎又升级了阿？
首页的表情字符被自动隐藏了

zing (http://zingyu.blogbus.com) 发表于 2008-04-16 13:26:02 [回复]
[avatar:47]非常感谢，我学会了
jiee 回复 Ss微涼说：
恩，不用谢
(2008-04-21 13:26:56)

Ss微涼 (http://ss-lulu.blogbus.com) 发表于 2008-04-16 10:03:58 [回复]
[avatar:44]非常感谢博主

ئارامگاھ بلوگ (http://www.aramga.cn) 发表于 2008-04-12 12:53:03 [回复]
[avatar:40]想请教一下，旧模板系统下可以用么？我试了一下，似乎实现不了。
jiee 回复 Kevin 说：
恩，旧模板与新模板系统的结构是不太一样的，不过你可以参考之前发布的方法
(2008-04-14 18:33:45)

Kevin () 发表于 2008-04-12 12:45:11 [回复]
[avatar:44]哈``太厉害了``一会去试下``

博X (http://5www.blogbus.com/) 发表于 2008-04-12 11:41:47 [回复]
[avatar:40]多谢万恶兄解答！^ ^

zing (http://zingyu.blogbus.com) 发表于 2008-04-12 10:12:54 [回复]
[avatar:40]我现在的blog里，上下两排的表情挨得太紧了。
请问一下，
可不可以在上下两排表情之间插入一些空隙？

zing (http://zingyu.blogbus.com) 发表于 2008-04-12 09:38:47 [回复]
[avatar:49]一般来说，如果不用framework的话还是尽量避免使用$的好。

这次的代码书写习惯看起来舒服多了，不错，加油!
jiee 回复 puNk!d 说：
谢谢……
(2008-04-14 18:35:36)

puNk!d (http://blogbus-hack.blogbus.com) 发表于 2008-04-12 00:02:56 [回复]
[avatar:40]你好
我的博客head部分有这样一个JS
http://aramga.blogbus.com/files/12056722140.js
这个是用来在文本框直接输入维吾尔语的
Ctrl+K 是维吾尔语和英语的切换
我放了你的表情代码后维吾尔语输入就不起作用了
你能不能帮我看看是哪里出现的问题呢?
jiee 回复 ئارامگاھ بلوگ 说：
之前发布的js代码可能与你那代码有冲突，目前我已经对部分代码作了调整，你再次按照文章说明复制一下代码试试
(2008-04-11 20:22:54)

ئارامگاھ بلوگ (http://www.aramga.cn) 发表于 2008-04-11 13:19:44 [回复]
[avatar:40]这个东西可以把表情移动到评论下面！

#emList {position:relative;top:-242px;left:420px;width:200px;} 这一句是控制表情图标显示在旁边的代码……你把它用/**/包围起来，或者直接删除就好了

爱晴 (http://liuqiyuan.blogbus.com/logs/18714708.html) 发表于 2008-04-11 09:46:09 [回复]
[avatar:40]我也想把表情放到评论框的下面。
如果不加上第一段CSS，表情倒是确实跑到下面了。可是当我自作聪明想加个<br>把表情换行之后，表情却直接就不显示了……|||
jiee 回复 zing 说：
#emList {position:relative;top:-242px;left:420px;width:200px;} 把代码当中的这句删除或者注释掉就好了，
(2008-04-11 20:24:35)

zing (http://zingyu.blogbus.com) 发表于 2008-04-11 01:14:58 [回复]
[avatar:40]呵呵最近在外地研究投资项目
很忙也没有时间更新博客
晚上上来看看支持万恶
jiee 回复豆子说：
谢谢豆子的支持
(2008-04-11 20:25:00)

豆子 () 发表于 2008-04-11 00:41:48 [回复]
[avatar:40]麻烦博主在讲下怎么在把这个插件
移动到评论框下面且把图片缩小一点。（嘻哈猴篇）

爱晴 (http://liuqiyuan.blogbus.com/logs/18714708.html) 发表于 2008-04-10 23:20:17 [回复]
[avatar:40]麻烦博主在讲下怎么在把这个插件
移动到评论框下面且把图片缩小一点。

（嘻哈猴篇）

爱晴 () 发表于 2008-04-10 22:58:15 [回复]
[avatar:40]贊一個

清平 (http://emanue.blogbus.com) 发表于 2008-04-10 19:37:50 [回复]
[avatar:40]感谢啊～～～

chenyurun (http://chenyurun.blogbus.com/) 发表于 2008-04-10 17:23:53 [回复]
[avatar:42]jiee，求你了。惦記一下舊模板唄~成不？
jiee 回复 anya 说：
旧模板不是已经说过了吗？
(2008-04-10 18:56:14)

anya (http://an-ya.blogbus.com/) 发表于 2008-04-10 17:07:42 [回复]
[avatar:40]有几点值得推敲的。
1、你的load事件会覆盖原有的load事件。
2、比如我用了jQuery的库，有可能与你的这个$函数冲突，当然我可以用jQuery()代替$()，从而避免这个问题。
3、setAttribute()函数在IE 6中有很大问题，建议不用。改用HTMLDom中定义的方法。
jiee 回复 arthuridea 说：
非常感谢athuridea你的提醒！问题1 当时我考虑到了，但没去解决，

问题2 我当时只图方便，没考虑到jQuery库的问题（后来一想，先前曾经发布过利用jQuery做过列表与摘要的切换显示那个方法，用到的$()会和这里的函数冲突），

你对问题3 的提法应该有点问题，setAttribute在ie下的解释方法确实存在一些问题，主要体现在用它在ie下设置某些属性的时候，会存在一些问题，dom的方法并不是不好，只是当时在写代码的时候觉得那样写好点……不过你现在提出了，我就又改成dom的方法了。

再次感谢你的提醒与讨论
(2008-04-10 20:23:34)

arthuridea (http://arthuridea.blogbus.com) 发表于 2008-04-10 16:47:20 [回复]
[avatar:40]呵呵，用了
jiee 回复伟一笑说：
没事老换模板……
(2008-04-10 20:27:37)

伟一笑 (http://sundawei.blogbus.com/) 发表于 2008-04-10 14:18:23 [回复]
[avatar:46]你现在用的这个模板没在FF下测试吧···
http://photo1.bababian.com/upload9/20080410/834E55822BDFCA4D10C0577393EB552D_800.jpg
jiee 回复 N!Ce 说：
谢谢提醒，我知道这个问题了，，是用了overflow:auto的问题……
(2008-04-10 14:56:47)

N!Ce () 发表于 2008-04-10 14:15:43 [回复]
[avatar:48]先留个言顶一下，再说，然后去试。

小建 (http://xiaojian0313.blogbus.com/logs/17550168.html) 发表于 2008-04-10 14:08:32 [回复]
[avatar:40]m(_ _)m

这个增强版确实方便多了～
jiee 回复 zing 说：
你在演示用的博客上的留言我看到了，那个主要是我没考虑替换的问题……
(2008-04-10 20:25:01)

zing (http://zingyu.blogbus.com) 发表于 2008-04-10 13:56:41 [回复]