IE9 Javascript error

Question

The tag cloud of my blog isn't rendering correctly with IE 9. The problem seems to be around those lines of code:

var fs = s(minFontSize,maxFontSize,ts[t]-ta,tz);
var li = document.createElement('li');
li.style.fontSize = fs+'px';

The strange thing is that everything works fine if I remove the compatibility tag:

<meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'/> 

But I can't do that or my opaque window turns black because of another script (See Disabling ieretrofit.js on Blogger ).

Can anyone help me to fix that?

ps: Since it isn't working I've hiden the tag cloud with the following JQuery snipet (lame, I know).

$(document).ready(function(){
  if ($.browser.msie ) {
    $("#Label1").hide();
  }
});

Answer 1

Your running into an IE7 specific bug.

Check this out:

http://bugs.jquery.com/ticket/4670

Wow, nice bug. It's not a jQuery bug though. You can reproduce it with bare DOM functions:

var li = document.createElement("li");
li.value = "12";

IE7 immediately crashes in MSHTML.DLL trying to access memory address 0x00000000. The same crash happens with li.setAttribute("value", "12"). Since (in HTML4 at least) the value of an < li> element only applies if it is a child of an < ol> element, I suspected it might be trying to access the parent node. Sure enough, this does not crash:

var ol = document.createElement("ol"); var li = document.createElement("li"); ol.appendChild(li); li.value = "12"; This bug seems to be fixed in IE8.

Answer 2

Figured it out. The s method sometimes returned NaN (that for some reason only caused trouble with IE in compatibility mode). I fixed it with the isNaN method like this:

if (!isNaN(fs)) {
  li.style.fontSize = fs+'px';
 }

And one more edit:

if (!isNaN(c[0]) && !isNaN(c[1]) && !isNaN(c[2])) {
  a.style.color = 'rgb('+c[0]+','+c[1]+','+c[2]+')';
}

This applies to that code and several variations.