首页 > 代码库 > 自定义字体
自定义字体
<!doctype html><html><head><meta charset="utf-8"><title>无标题文档</title><style>#wrap{ background:url(img/qq.jpg) no-repeat; width:556px; height:535px; margin:10px auto; position:relative; display:block; }#box{ position:absolute; top:100px; left:10px; height:270px; width:385px; display:block; font-size:16px; overflow:auto; }#box div{ width:20px; display:inline-block; font-size:16px; margin:2px 0; } select{ position:absolute; top:381px; left:5px; }textarea{ border:none; position:absolute; width:385px; height:75px; left:10px; top:415px; font-size:16px; }input{ position:absolute; top:505px; left:320px; width:80px; cursor:pointer; }div img{ width:16px; height:16px; } </style><script type="text/javascript"> window.onload = function () { var obtn = document.getElementsByTagName(‘input‘)[0]; var oselect = document.getElementsByTagName(‘select‘)[0]; var obox = document.getElementById(‘box‘); var otext = document.getElementsByTagName(‘textarea‘)[0]; var json = { ‘love‘:‘img/love.gif‘, ‘knife‘:‘img/knife.gif‘ } obtn.onclick = function () { var str = otext.value; if(str == ‘‘) { alert(‘请输入内容‘); } if(oselect.value =http://www.mamicode.com/= ‘default‘) { obox.innerHTML += str + ‘<br>‘; otext.value = ‘‘; } for( attr in json) { usefont(attr,json[attr],str); } }; function usefont(fontstyle,url,str) { if(fontstyle == oselect.value) { var arr = str.split(‘‘); var str = ‘‘; for( var i = 0; i < arr.length; i++ ) { obox.innerHTML += ‘<div><img src = "http://www.mamicode.com/‘ + url + ‘"><span>‘ + arr[i] + ‘</span></div>‘; } obox.innerHTML += str + ‘<br>‘; otext.value = ‘‘; } } };</script></head><body><div id="wrap"> <div id="box"></div> <select id="font-style"> <option value="http://www.mamicode.com/love">爱心文字</option> <option value="http://www.mamicode.com/knife">小刀文字</option> <option selected="" value="http://www.mamicode.com/default">默认文字</option> </select> <textarea></textarea> <input type="button" value="http://www.mamicode.com/发送"></div></body></html>
自定义字体
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。