码迷,mamicode.com
首页 > 移动开发 > 详细

处理部分手机无法显示emoji表情

时间:2019-11-26 16:17:40      阅读:273      评论:0      收藏:0      [点我收藏+]

标签:lin   开源   static   https   html   das   info   jquer   怎么   

emoji表情不断地添加 部分用户不更新手机系统导致网页中显示不了新的emoji表情

理想情况

技术图片

 

 

 糟糕情况1

技术图片

 

 

  糟糕情况2

技术图片

 

 

  糟糕情况3

技术图片

 

 

怎么解决这些糟糕的情况呢?

引入CDN(也可以npm安装)

<link href="http://cdn.staticfile.org/emoji/0.2.2/emoji.css" rel="stylesheet" type="text/css" />
<script src="http://cdn.staticfile.org/jquery/2.1.0/jquery.min.js"></script>
<script src="http://cdn.staticfile.org/emoji/0.2.2/emoji.js"></script>

 

 <div class="emojstext">????????????asdasdasd</div>

 

  <script>
    var $text = $(.emojstext);
    var html = $text.html().trim().replace(/\n/g, <br/>);
    $text.html(jEmoji.unifiedToHTML(html));
  </script>

 

替换完的效果

技术图片

 

原理是 将原来的emoji表情替换成背景图片

技术图片

 

 

 

该项目开源地址

https://github.com/node-modules/emoji

 

处理部分手机无法显示emoji表情

标签:lin   开源   static   https   html   das   info   jquer   怎么   

原文地址:https://www.cnblogs.com/Leesttee/p/11936263.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!