Javascript来增加/减少字体大小（外部CSS）

我设法将一个脚本，将增加使用按钮或链接的网页部分的字体大小。它在Moz/Chrome中工作，但坚持IE浏览器，理论上它应该不会在这些主流浏览器中遇到问题。但我坚持是否可以使用currentStyle从getElementsByName填充的变量中获取fontSize;当然IE浏览器正在绘制空白。Javascript来增加/减少字体大小（外部CSS）

这里是我的脚本：

function changeFontSize(element,step) 
{ 
    var styleProp = 'font-size'; 
    step = parseInt(step,10); 

    var x = document.getElementsByName(element); 

    for(i=0;i<x.length;i++) { 

     if (x[i].currentStyle) { 
      var y = parseInt(x[i].currentStyle[styleProp],10); 

     } else if (window.getComputedStyle) {   
      var y = parseInt(document.defaultView.getComputedStyle(x[i],null).getPropertyValue(styleProp),10); 

     } 

     x[i].style.fontSize = (y+step) + 'px'; 
    } 
}

我用来拉了一起的3个站点是：

www.vijayjoshi.org

www.quirksmode.org

和（这不是垃圾邮件，这实际上很重要）//http://www.white-hat-web-design.co.uk/blog/controlling-font-size-with-javascript/

任何人都可以指出一个解决方案吗？提前致谢！

来源

2011-08-04 Moniarde

怎么样用下面的更新代码：与修复和一些更好的命名了一些变量

function changeFontSize(element,step) 
{ 
function computeFontSizeUpdate(oE) 
{ 
//- init fSize with proper null value 
var fSize = null; 
//- retrieve fSize from style 
if (oE.currentStyle) { 
    fSize = parseInt(oE.currentStyle[styleProp], 10); 
} 
else if (window.getComputedStyle) { 
    var s = document.defaultView.getComputedStyle(oE,null); 
    fSize = (s) ? parseInt(s.getPropertyValue(styleProp),10) : NaN; 
} 

//- check fSize value based on return of parseInt function 
if(isNaN(fSize) == false && fSize != null) 
{ 
    fSize += nStep + 'px'; 
    if(oE.currentStyle) 
     oE.currentStyle.fontSize = fSize; 
    else 
     oE.style.fontSize = fSize; 
} 
}; 

var styleProp = 'font-size'; 
var nStep = parseInt(step, 10); 

//- ensure step value 
if(isNaN(nStep)) nStep = 0; 

//- get target elements 
var oElems = document.getElementsByName(element); 

if (oElems && oElems.length == 0) 
{ 
    var oE = document.getElementById(element); 
    if(oE) computeFontSizeUpdate(oE); 
} 
else 
{ 
    for(oE in oElems) 
    { 
    computeFontSizeUpdate(oE); 
    } 
} 

}

我已经更新脚本。

此外，我很抱歉，因为我现在在Mac上，我无法测试在IE提供的脚本...但从我记得应该做的伎俩。

使用一些JS控制台，您可以直接直接将此页

changeFontSize("nav-tags", 50);

上执行，你会发现，在菜单栏中的标签元素将得到受影响:)

希望这有助于

来源

2011-08-04 05:37:52

这里有一个错误： var s = document.defaultView.getComputedStyle（x [i]，null）;' 问题与x [i] var？看不到它应该是什么。我试过oE，错误消息说“没有这样的接口支持”。 – Moniarde

请检查更新的代码。谢谢:) –

我认为同样的问题。这里是我在Firebug中遇到的错误：'未捕获的异常：[Exception ...“无法转换JavaScript参数arg 0 [nsIDOMViewCSS.getComputedStyle]”'我认为它在代码的第12行。 – Moniarde

Javascript来增加/减少字体大小（外部CSS）

回答

相关问题