Tuesday, March 31st, 2009
We mentioned that a new excanvas was released to keep up support with IE 8. Well, Louis-Rémi Babe has detailed his travails finding out what what changed in IE 8 VML land:
Although the VML specification hasn’t undergone any improvements or modifications since its publication back in 1998, Microsft development team felt like considerably changing the way their own standard should be handled:
- The namespace declaration has to take a second argument to be functional:
document.namespaces.add('v', 'urn:schemas-microsoft-com:vml', "#default#VML");
instead of simply:
- The selector for the behaviour rules needs to be slightly modified (more information follows).
- For a standard compliance purpose, when setting dimensions or position of an element, the unit no longer defaults to ‘px’. It has to be explicitly specified
- It is no longer possible to create a VML element outside of the DOM:
var myFragment = document.createDocumentFragment();
'<v:rect id="myRect" fillcolor="blue" style="top:10px;left:15px;width:50px;height:30px;position:absolute;"></biv:rect>'
This rect element will not be displayed! And don’t try to modify its CSS properties with the developer tool, you are likely to crash the tab or even the browser, if you’re lucky. Fortunately, there is an easy fix for this bug: you just have to copy the outerHTML of the element into itself:
var myRect = document.getElementById('myRect');
myRect.outerHTML = myRect.outerHTML;
- It’s no more possible to use % unit! This one is my favourite. The advantage of vector graphics is that they can be scaled without quality loss. Now tell me how you scale a graphic from which all components dimensions and position are set in pixels! You have to resort to using the onpropertychange event to recalculate one after the other those values each time you want to resize your graphic. But there is a lot of case where you simply can’t fix this bug. For example, if you had an rectangle in a div: the div has no dimensions and scales with its content, and you want the height of your rectangle to scale with the div. There was a time when it was possible to simply set the height of the rectangle to 100% (providing the position of the div is relative, of course). But it was probably too easy after all.
Remarkably, none of this change has been announced by the IE dev team, as far as I know. The only announcement made about VML can be found on a blog post
Posted by Dion Almaer at 12:19 am