通过JavaScript控制字体大小的代码


为了此代码到您的网页必须使用像素大小的字体(PX),而不是相对大小的字体,使用“EM”或“%”。当然如果你使用其他字体单位的代码可以很容易地适应这些。如果脚本不能找到一个段落的字体大小,它会默认为12px。
核心代码:

复制代码 代码如下:

var min=8;
var max=18;
function increaseFontSize() {
var p = document.getElementsByTagName('p');
for(i=0;i<p.length;i++) {
if(p[i].style.fontSize) {
var s = parseInt(p[i].style.fontSize.replace("px",""));
} else {
var s = 12;
}
if(s!=max) {
s += 1;
}
p[i].style.fontSize = s+"px"
}
}
function decreaseFontSize() {
var p = document.getElementsByTagName('p');
for(i=0;i<p.length;i++) {
if(p[i].style.fontSize) {
var s = parseInt(p[i].style.fontSize.replace("px",""));
} else {
var s = 12;
}
if(s!=min) {
s -= 1;
}
p[i].style.fontSize = s+"px"
}
}

包括上面的代码在您的网页(无论是放置在头部分,或将其放置在一个外部JS文件和进口)。然后可以调用的增加和减少象下面的字体大小的功能。
使用方法:
复制代码 代码如下:

<a href="javascript:decreaseFontSize();">-</a>
<a href="javascript:increaseFontSize();">+</a>



相关阅读:
网页优化的最基础部分:HTML的优化
Asp.net + Access 压力测试
可以显示单图片,多图片ajax请求的ThickBox3.1类下载
ASP.NET设计网络硬盘之两个重要类
在DataTable中执行Select("条件")后,返回DataTable的方法
PHP+AJAX实现无刷新注册(带用户名实时检测)
详细解析:关于PHP事件驱动问题
Linux oracle 9i图文安装教程五
实例说明asp.net中的简单角色权限控制
PHP匹配连续的数字或字母的正则表达式
解决Oracle数据库10g导出错误6550
Vista下以真正的管理员登陆的设置方法
HTML5教程:HTML5的基础写法
织梦DedeCMS V57 111015升级出现乱码错误解决方法分享
快速导航

Copyright © 2016 phpStudy |