我是靠谱客的博主 俊逸大船,最近开发中收集的这篇文章主要介绍通过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>

最后

以上就是俊逸大船为你收集整理的通过JavaScript控制字体大小的代码的全部内容,希望文章能够帮你解决通过JavaScript控制字体大小的代码所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(136)

评论列表共有 0 条评论

立即
投稿
返回
顶部