Question

When I found Hilight I almost fell down my chair. It’s exactly what I need 🙂

Now, the sad thing is that the demo doesn’t seem to work in IE8. Are there any fixes or alternatives out there?

Answer 1

I debugged through maphilight source code and found that IE8 chokes while adding the rule for newly created stylesheet. When I searched on Google for this particular problem, I found a bug report on OpenLayer’s track. The bug report had a patch and I used this patch on maphilight plugin to fix it.

Here’s what you need to do. Open jquery.maphilight.js (uncompressed source) and go to line 63, you will see something like following:

document.createStyleSheet().addRule("v\\:*", "behavior: url(#default#VML); antialias: true;"); //IE8 chokes on this line.
document.namespaces.add("v", "urn:schemas-microsoft-com:vml");

Replace the above with following:

document.namespaces.add("v", "urn:schemas-microsoft-com:vml"); 
var style = document.createStyleSheet();
var shapes = ['shape','rect', 'oval', 'circ', 'fill', 'stroke', 'imagedata', 'group','textbox'];  
$.each(shapes,
    function()
    {
        style.addRule('v\\:' + this, "behavior: url(#default#VML); antialias:true");
    }
);

It should now work in IE8. Here’s the proof, see how Wyoming is highlighted.

I am not sure if this will work in IE6 and IE7. You will have to test it yourself. If this breaks in IE6 and IE7, you will have to put this patch only when browser is IE8.

Once again, credit for the above patch to the original author. I only debugged the issue in maphilight plugin.