JavaScript 控制字体大小设置的方法

在做公司的官网的时候，新闻内页会有一个让浏览者自己调整文字大小的功能，因此在这个空闲时间，把这个功能整理下来：

function setFontSize (id,content,params){
      var oTarget = document.getElementById(id),
 content = document.getElementById(content),
 size = params.size || 14,
 maxSize = params.maxSize || 20,
 step = params.step || 2;
 oBtn = '';
 oBtn1 = null,
 oBtn2 = null;

 oTarget.innerHTML = oBtn;
 oBtn1 = oTarget.childNodes[0];
 oBtn2 = oTarget.childNodes[1];

 oBtn1.onclick=function(){
   if(size+step <= maxSize){
     size+=step;
   }else{
     size = maxSize;
     this.className+=' disabled';
     this.disabled = true;
   }
   oBtn2.className.replace('disabled','');
   oBtn2.disabled = false;
   content.style.fontSize = size +'px';
 }
 oBtn2.onclick=function(){
   if(size-step >= 12){ 
     size-=step;
   }else{
     size = 12;
     this.className+=' disabled'
     this.disabled = true;
   }
   oBtn1.className.replace('disabled','');
   oBtn1.disabled = false;
   content.style.fontSize = size +'px';
      }
  }

调用方式：

setFontSize(id,contentid,{size:,maxSize,step:});

提示：可以通过font-size:0的方式来隐藏Input元素的value值，然后自定义按钮的样式。

以上这篇Javascript 控制字体大小设置的方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持考高分网。