HTML5 enabling script
Since HTML5 is getting more attention by way of marking up our new pages, and the only way to get IE to acknowledge the new elements, such as <article>, is to use the HTML5 shiv, I've quickly put together a mini script that enables all the new elements.
Usage & Download
The html5.js and must be inserted in the head element (this is because IE needs to know about the element before it comes to render them - so it can't sit in the footer of the page, i.e. below the elements in question).
It's conditional within the code, so Firefox et al won't run the code - but it doesn't hurt to wrap it in an IE conditional call to reduce the http pulls for other browsers:
<!--[if IE]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
I've also minified the file, so it's a matter of bytes to download.
You should follow me on Twitter here I'll tweet about JavaScript, HTML 5 and other such gems (amongst usual tweet-splurges)
The 'eventsource' element has been removed from the specification, so it is no longer needed in html5shiv.
Very good!! Nice! Thanks. xD
The latter has changed: "eventsource" has move to it's own spec now: http://dev.w3.org/html5/eventsource/
br--mabra
Does this mean that I can start using HTML5 in all of my future web design projects? Or will there still be some issues with people being able to see the website correctly if they have older browser versions? Thanks for your help.
I would recommend changing the conditional comment condition to [if IE<9]
A few people over at doctype.com discovered an important caveat:
Since JavaScript is required to make IE understand and style new elements, and since JS is not executed when printing a document, IE will not apply styles from a print stylesheet to HTML5 elements!
^^ need an answer for the same question. Anyone?
/*@cc_on
(function(a){while("undefined" !== document.createElement(a.shift()).tagName );})
("abbr,article,aside,audio,canvas,datalist,details,eventsource,figure,footer,header,hgroup,mark,menu,meter,nav,output,progress,section,time,video".split(","))
@*/
[...] right in IE, but, well, I don’t actually care all that much, to be honest. (I’m using Remy’s HTML5 shim, [...]
Well, if the problem with printing in IE6 persists then I am not going to use HTML5.
Well, if the problem with printing in IE persists then I am not going to use HTML5.
Why have string if you actually want an array? Some kind of optimisation? Anyway here's my take on the script for readability. JSLint says the for loop should have a condition - presumably we should check for existence of the tags first but it is probably sufficient to handle this in the conditional use of the script in the first place.
I seem to be missing the summary tag there. Its the first element of a detail block.