当前位置：首页 > 资讯 > 技术文档

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

时间：2021-09-27 14:42 编辑：来源：阅读：
扫一扫，手机访问

摘要：通过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文件和进口）。然后可以调用的增加和减少象下面的字体大小的功能。使用方法：

[u]复制代码[/u] 代码如下:

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

全部评论(0)

上一篇：js实现遮罩层划出效果是生成div而不是显示
下一篇：JS打开层/关闭层/移动层动画效果的实例代码

资讯排行榜
更多>>