Webshims Lib

Polyfill only the incapable browsers

Demo/About/Documentation HTML5 shiv

IE8- isn't capable of rendering HTML5 elements. Webshims lib in combination with Modernizr automatically fixes this issue and adds WAI-ARIA landmarks to enable accessibility of HTML5.

Dynamically adding HTML5 markup

Additionally it implements the following manipulation methods .htmlPolyfill(), .appendPolyfill(), .prependPolyfill(), .afterPolyfill(), .beforePolyfill() and .replaceWithPolyfill() to also allow dynamic creation of HTML5 elements.

$('#my-id').appendPolyfill('<section><form action="#"><input type="text" placeholder="hello this is required" required="required" name="test" /><input type="date" required="required" name="test2" /><input type="submit" /></form></section>');

jQuery 1.7+ features

Starting with jQuery 1.7 webshims lib also supports the following manipulation methods: .appendPolyfillTo(), .prependPolyfillTo(), .insertPolyfillAfter(), .insertPolyfillBefore() and .replacePolyfillAll().

If a plugin is used, which uses a "normal" jQuery manipulation method instead of the corresponding webshims enhanced manipulation method to generate new HTML5 content (i.e.: .html() instead of .htmlPolyfill()), the method .updatePolyfill() can be used:

$('#my-dynamic-container').load('ajax/test.html', function(){ $(this).updatePolyfill(); });

html5.shivMethods config

The html5shiv also fixes dynamically creating HTML5 elements in IE6/7/8. In case you do not create HTML5 elements dynamically using JavaScript or you are using jQuery 1.7+ manipulation methods for creating HTML5 elements, you should set html5.shivMethods to false:

<script> // set options for html5shiv *before* embeding html5shiv window.html5 = { shivMethods: false }; </script> <script src="modernizr-with-shiv.js"></script> <script src="modernizr-with-shiv.js"></script> <script> // set options for html5shiv *after* embeding html5shiv window.html5.shivMethods = false; </script> <script> // set options for html5shiv if(!window.html5){ window.html5 = {}; } window.html5.shivMethods = false; </script>