龙盟编程博客 | 无障碍搜索 | 云盘搜索神器
快速搜索
主页 > web编程 > Javascript编程 >

通过js控制文章内容字体大小代码

时间:2012-12-29 08:41来源:未知 作者:admin 点击:
分享到:
一款比较好的js可控制字体大小的朋友,这里它会获取p标签的所有内容,如果有想改的话,只要把var p = document.getElementsByTagName(“p”);里面的p改成你要的id名就可以了。 代码如下 保存为
一款比较好的js可控制字体大小的朋友,这里它会获取p标签的所有内容,如果有想改的话,只要把var p = document.getElementsByTagName(“p”);里面的p改成你要的id名就可以了。
 代码如下

保存为a.html代码
<script>
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"
}
}
</script>

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


<p>
点击上面可以控制,里的字体放大缩小哦,有需要的朋友可以参考一下。
</p>


精彩图集

赞助商链接