Question

As we know, the font-size of a HTML-element is either set explicitly like style="font-size:10px" or calculated by the browser according to rules and properties from style sheets and parent properties.

It could be a rather complex task to calculate the font-size value in javascript as the correct result might depend on classes that do not necessarily exist in the elements className attribute.

Is there a way I can get the calculated font-size directly, like div.style['calculated-font-size'] ? – thanx

Answer 1

function elementCurrentStyle(element, styleName){
if (element.currentStyle){
var i = 0, temp = “”, changeCase = false;
for (i = 0; i < styleName.length; i++)
if (styleName[i] != ‘-‘){
temp += (changeCase ? styleName[i].toUpperCase() : styleName[i]);
changeCase = false;
} else {
changeCase = true;
}
styleName = temp;
return element.currentStyle[styleName];
} else {
return getComputedStyle(element, null).getPropertyValue(styleName);
}
}

alert(elementCurrentStyle(myDiv,"font-size"));

I’ve describe this “getting computed style” issue few weeks ago here.

cheers,