一个不错的前端表情插件

mengkun 31.7K 90

丰富的表情是本博客改版后的一大亮点 [aru_3]

老规矩,好东西不独享。咱这就分享一下这款插件! #(你懂的)

纵观整个博客圈,大多数的博客要么表情很少,要么用的是 @DIYgod 大神的 OwO 实现的多表情。但是,OwO 有一个比较坑的地方在于表情是以 img 标签的形式直接插入到输入框里的……并不是我需要的那种……[aru_15]

正在发愁之时找到了 jQuery-emoji 这款插件,基本能满足我的需求![aru_37]

But,jQuery-emoji 也并不完美。它的表情配置方式依旧不够灵活,而且在移动端体验较差。花了点时间,将它的代码稍微改了改,这下感觉好多了 #(勉强)(其实还是有点小问题,,不过不影响使用。忽略好了……)

相对于原版,主要改动的地方如下:

  • 新增表情列表根文件目录设置
  • 删除对 mCustomScrollbar 的依赖
  • 更改表情配置方式
  • 修改表情预览框位置的判定方式
  • 增加对移动端的兼容
  • 整合了贴吧、QQ、微博、阿鲁全套表情

修改版下载地址:https://github.com/mengkunsoft/jQuery-emoji

原版下载地址:https://github.com/eshengsky/jQuery-emoji

使用说明参见代码中的 index.html,至于整么整合进 WordPress,请自行研究!本人不提供技术指导 [aru_60]

发表评论 取消回复
表情 图片 链接 代码

  1. 死亡飞车

    [aru_1][aru_2][aru_3][aru_4][aru_5][aru_6][aru_7][aru_8][aru_9][aru_10][aru_11][aru_12][aru_13][aru_14][aru_15][aru_16][aru_17][aru_18][aru_19][aru_20][aru_21][aru_22][aru_23][aru_24][aru_25][aru_26][aru_27][aru_28][aru_29][aru_30][aru_31][aru_32][aru_33][aru_34][aru_35][aru_36][aru_37][aru_38][aru_39][aru_40][aru_41][aru_42][aru_43][aru_44][aru_45][aru_46][aru_47][aru_48][aru_49][aru_50][aru_51][aru_52][aru_53][aru_54][aru_55][aru_56][aru_57][aru_58][aru_59][aru_60][aru_61][aru_62][aru_63][aru_64][aru_65][aru_66][aru_67][aru_68][aru_69][aru_70][aru_71][aru_72][aru_73][aru_74][aru_75][aru_76][aru_77][aru_78][aru_79][aru_80][aru_81][aru_82][aru_83][aru_84][aru_85][aru_86][aru_87][aru_88][aru_89][aru_90][aru_91][aru_92][aru_93][aru_94][aru_95][aru_96][aru_97][aru_98][aru_99][aru_100][aru_101][aru_102][aru_103][aru_104][aru_105][aru_106][aru_107][aru_108][aru_109][aru_110][aru_111][aru_112][aru_113][aru_114][aru_115][aru_116][aru_117][aru_118][aru_119][aru_120][aru_121][aru_122][aru_123][aru_124][aru_125][aru_126][aru_127][aru_128][aru_129][aru_130][aru_131][aru_132][aru_133][aru_134][aru_135][aru_136][aru_137][aru_138][aru_139][aru_140][aru_141][aru_142][aru_143][aru_144][aru_145][aru_146][aru_147][aru_148][aru_149][aru_150][aru_151][aru_152][aru_153][aru_154][aru_155][aru_156][aru_157][aru_158][aru_159][aru_160][aru_161][aru_162][aru_163][aru_164] 按了两分钟,一共164个表清包 ......

  2. 死亡飞车

    地址打不开[aru_15]

  3. xx
    xx Lv 1

    这个不错[aru_1]

  4. sure
    sure Lv 1

    讲真,打算分享一下你的工具条吗

  5. 北巷季
    北巷季 Lv 1

    [wb_二哈]

  6. 温言
    温言 Lv 1

    话说,可以付费帮忙配置一下吗。[aru_1][aru_36]

  7. #(滑稽)
    #(滑稽) Lv 1

    #(滑稽)

  8. 呐
    Lv 1

    ...路径配置不起作用是什么情况

    • mengkun
      mengkun 站长

      @呐估计是缓存了修改前的 js 文件,清空一下缓存试试

  9. TY
    TY Lv 1

    。好吧你把名称改了。。

  10. TY
    TY Lv 1

    发现一个逻辑上的错误,QQ [钱币] 旧贴吧 #[钱币]

  11. 试下
    试下 Lv 1

    [aru_3]就想试试你的表情包

  12. 那个敬业福
    那个敬业福 Lv 1

    讲真,真的喜欢这套表情包

  13. AAAA
    AAAA Lv 1

    厉害[aru_1]

  14. 528947483
    528947483 Lv 1

    怎么添加到后台,坤哥求指教~

  15. wierli
    wierli Lv 1

    很棒呀,百度了一圈终于找到了。#[滑稽]

  16. 译丶浅夏
    译丶浅夏 Lv 1

    #[啊][撇嘴]

  17. 小白
    小白 Lv 1

    怎么整和进wp啊,大佬出个教程吧

  18. 台庄资讯

    [aru_162][aru_162]来个教程吧

  19. 小白
    小白 Lv 1

    hadsky轻论坛可以用吗?

  20. 2381548894
    2381548894 Lv 1

    怎么搞进emlog

  21. 男人不可以穷

    感觉都用键值对,超级麻烦,还是循环输出吧[aru_39]

  22. 请叫我大熊
    请叫我大熊 Lv 1

    [斜眼笑]

  23. 多元菌
    多元菌 Lv 1

    [aru_3]我网站用你这款表情包了

  24. 454194741
    454194741 Lv 1

    赞一下

  25. telnet
    telnet Lv 1

    表示完全看不懂,下载下来了,不知道咋弄。。。里面的示例也看不懂,是真的[aru_78]
    ,我不是程序员,但是喜欢瞎捯饬,求高人指点[aru_44]

  26. 1548894273
    1548894273 Lv 1

    使用之后 显示不了表情 是各种代码[aru_15]

  27. 1548894273
    1548894273 Lv 1

    发现识别不了QQ 好昵称[aru_18] 接受邮件通知功能是QQ邮箱吗

    • mengkun
      mengkun 站长

      @1548894273自动填充功能偶尔抽风

      • 1548894273
        1548894273 Lv 1

        @mengkun回复后确实QQ邮件通知了。这功能是不是还要配置MAS机还是其他?

      • mengkun
        mengkun 站长

        @1548894273想多了…… php 发送邮件

      • 1548894273
        1548894273 Lv 1

        @mengkun学习了 我用的是CI框架

      • admin
        admin Lv 1

        @1548894273解决了 感谢![aru_42]

      • admin
        admin Lv 1

        @mengkun 查看图片
        想问下这个移动端右边多出来这块怎么解决掉啊

      • mengkun
        mengkun 站长

        @admin

        overflow-x: hidden;
      • Admin
        Admin Lv 1

        @mengkun我用过的啊 我用的overflow:hidden但是没有效果 是我加错地方了嘛 我直接放在emoji container上的[aru_16]

      • sure
        sure Lv 1

        @Admin老哥分享下教程?或者说说怎么做可以吗

      • Admin
        Admin Lv 1

        @mengkun另外你这个网站上貌似也存在这个问题 就是 移动端 弹出表情后 右侧出现一大片空白 你往左边一滑动就可以看到了

      • Admin
        Admin Lv 1

        @mengkun你可以用手机访问试一下 弹出表情框够 手指左边滑动

      • admin
        admin Lv 1

        @mengkun就是兼容性出现问题 硬是把版面给挤坏掉了

分享