增加/减少字体大小脚本 - 如何添加默认文本大小功能?

时间:2009-07-16 09:51:22

标签: javascript

有没有人知道如何修改下面的脚本,以便除了两个当前函数(changeFontSize(id,true); //增加字体大小 - changeFontSize(id); //减小大小),我可以添加第三个函数,将字体大小重置为默认设置?

谢谢你,Chris

SCRIPT

function changeFontSize(objId,doIncreaseSize){ //在使用前定义变量,否则它们将变为全局变量。     var currentSize = 0,         obj = document.getElementById(objId),         newVal = 0,         limitMax = 10,         limitMin = 0.5,         单位= 0.1;

if( !obj ){
 return false; //Avoids errors if obj isn't found.
}
currentSize = parseFloat( obj.style.fontSize );
if( doIncreaseSize ){
    unit = -unit; // unit becomes negative. This turns subtractions into addition.
}
newVal = currentSize - unit;
if( limitMax >= newVal && limitMin <= newVal ){
    obj.style.fontSize = newVal + "em";
}

};

2 个答案:

答案 0 :(得分:1)

您需要在某处保存原始字体大小(假设它不是1em),例如在对象本身或外部数组中。

这样的事情:

function changeFontSize(objId, doIncreaseSize) { 
  var currentSize = 0, obj = document.getElementById(objId), newVal = 0, limitMax = 10, limitMin = 0.5, unit = 0.1;
  if(!obj){
    return false;
  }
  currentSize = parseFloat( obj.style.fontSize );
  if (!obj.originalSize) { obj.originalSize = currentSize; }
  if(doIncreaseSize){
    unit = -unit;
  }
  newVal = currentSize - unit;
  if(limitMax >= newVal && limitMin <= newVal){
    obj.style.fontSize = newVal + "em";
  }
  return true;
}

function resetDefaultSize(objId) { 
  var obj = document.getElementById(objId);
  if(!obj){
   return false;
  }
  if (obj.originalSize) { obj.style.fontSize = obj.originalSize + "em"; }
  return true;
}

请注意,只有当元素的显式定义font-size且单位为em时,您的代码才有效。

答案 1 :(得分:0)

取你所做的,你可以做的是,而不是使用doIncreaseSize作为布尔值,你可以改为调用该变量动作并执行

...
if (action == 'sub') {
    unit = -unit;
}
newVal = currentSize - unit;
if (action == 'def') {
    newVal = some_default_value;
}
...

但真正的问题是你为什么要这样做呢?设置值而不是增加和减少可能要容易得多,除非您打算创建一个用户可以单击以增加和减少网页文本大小的按钮。但就像在评论中发布的那样,可以直接在浏览器中完成。