您的位置:首页 > 其它

默认头像方法-使用用户名称第一个字符作为默认头像

2017-11-09 11:18 525 查看
1 function(e,t){function n(n,i){n=n||"",i=i||60;var o,a,r,s,c,l,u=["#1abc9c","#2ecc71","#3498db","#9b59b6","#34495e","#16a085","#27ae60","#2980b9","#8e44ad","#2c3e50","#f1c40f","#e67e22","#e74c3c","#eca0f1","#95a5a6","#f39c12","#d35400","#c0392b","#bdc3c7","#7f8c8d"],d=String(n).toUpperCase().split(" ");return o=d.length==1?d[0]?d[0].charAt(0):"?":d[0].charAt(0)+d[1].charAt(0),e.devicePixelRatio&&(i*=e.devicePixelRatio),a=("?"==o?72:o.charCodeAt(0))-64,r=a%20,s=t.createElement("canvas"),s.width=i,s.height=i,c=s.getContext("2d"),c.fillStyle=u[r-1],c.fillRect(0,0,s.width,s.height),c.font=Math.round(s.width/2)+"px Arial",c.textAlign="center",c.fillStyle="#FFF",25>i?c.fillText(o,i/2,i/1.37):"U"===o||"V"===o||"W"===o?c.fillText(o,i/2,i/1.42):c.fillText(o,i/2,i/1.48),l=s.toDataURL(),s=null,l}if(n.transform=function(){Array.prototype.forEach.call(t.querySelectorAll("img[avatar]"),function(e,t){t=e.getAttribute("avatar"),e.src=n(t,e.getAttribute("width")),e.removeAttribute("avatar"),e.setAttribute("alt",t)})},"function"==typeof define&&define.amd)define(function(){return n});else if("undefined"!=typeof exports)"undefined"!=typeof module&&module.exports&&(exports=module.exports=n),exports.LetterAvatar=n;else{window.LetterAvatar=n;var i=window.MutationObserver||window.WebKitMutationObserver;if(i){var o={childList:!0,subtree:!0,characterData:!0},a=new i(function(){n.transform()});a.observe(t,o)}else t.addEventListener&&(t.addEventListener("DOMContentLoaded",function(){n.transform()}),t.addEventListener("DOMSubtreeModified",function(){n.transform()}),t.addEventListener("DOMNodeInserted",function(){n.transform()}))}}(window,document),function(){this.Flash={hasElement:!1,show:function(e,t){var n,i,o;return null==t&&(t="info"),o='<div data-notify="container" class="ui {0} message" role="alert"><i data-notify="dismiss" class="close icon"></i><span data-notify="message">{2}</span></div>',n={message:e},i={type:t},e?(i.delay=3e3,i.template=o,i.offset={x:10,y:30},i.element="#messages-container",this.hasElement||this.findOrInitElement(i),$.notify(n,i)):void 0},findOrInitElement:function(e){var t,n;return t=$(e.element),t.length||(n=e.element.replace("#",""),$("body").append('<div class="flash-messages" id="'+n+'"></div>')),this.hasElement=!0}}}.call(this)


思路一样就不造轮子了,这是码云网站的给没有上传图像用户指认用户名第一个字符作为头像的代码。



自己可以代码反压缩一下看里面的具体思路。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐