Skip to content

This script is the defacto way to enable use of HTML5 sectioning elements in legacy Internet Explorer.

Notifications You must be signed in to change notification settings

MLaritz/html5shiv

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

The HTML5 Shiv Nuget Package

This is a fork of the original repo designed solely to be used to create an up-to-date NuGet package. The package can be found by searching for HTML5.HTML5Shiv.

You can find more information on the HTML5 Shiv by visiting the original repository.

NuGet Package

A NuGet Package for use with Asp.Net. This package includes both the html5shiv.js file and the html5shiv-printshiv.js files (and minified version of both files). The package will install these files in your Scripts folder.

HTML5 Shiv

The HTML5 Shiv enables use of HTML5 sectioning elements in legacy Internet Explorer and provides basic HTML5 styling for Internet Explorer 6-9, Safari 4.x (and iPhone 3.x), and Firefox 3.x.

What do these files do?

html5shiv.js

  • This includes the basic createElement() shiv technique, along with monkeypatches for document.createElement and document.createDocumentFragment for IE6-8. It also applies basic styling for HTML5 elements for IE6-9, Safari 4.x and FF 3.x.

####html5shiv-printshiv.js

  • This includes all of the above, as well as a mechanism allowing HTML5 elements to be styled and contain children while being printed in IE 6-8.

Creators of HTML5Shiv

HTML5 Shiv is maintained by Alexander Farkas, Jonathan Neal and Paul Irish, with many contributions from John-David Dalton. It is also distributed with Modernizr, and the two google code projects, html5shiv and html5shim, maintained by Remy Sharp.

For more information, head to the original repository for the HTML5Shiv.

Usage

Include the HTML5 shiv in the <head> of your page in a conditional comment and after any stylesheets.

<!--[if lt IE 9]>
	<script src="/Scripts/html5shiv.js"></script>
<![endif]-->

HTML5 Shiv API

HTML5 Shiv works as a simple drop-in solution. In most cases there is no need to configure HTML5 Shiv or use methods provided by HTML5 Shiv.

html5.elements option

The elements option is a space separated string or array, which describes the full list of the elements to shiv. see also addElements.

Configuring elements before html5shiv.js is included.

//create a global html5 options object
window.html5 = {
  'elements': 'mark section customelement' 
};

Configuring elements after html5shiv.js is included.

//change the html5shiv options object 
window.html5.elements = 'mark section customelement';
//and re-invoke the `shivDocument` method
html5.shivDocument(document);

html5.shivCSS

If shivCSS is set to true HTML5 Shiv will add basic styles (mostly display: block) to sectioning elements (like section, article). In most cases a webpage author should include those basic styles in his normal stylesheet to ensure older browser support (i.e. Firefox 3.6) without JavaScript.

The shivCSS is true by default and can be set false, only before html5shiv.js is included:

//create a global html5 options object
window.html5 = {
	'shivCSS': false
};

html5.shivMethods

If the shivMethods option is set to true (by default) HTML5 Shiv will override document.createElement/document.createDocumentFragment in Internet Explorer 6-8 to allow dynamic DOM creation of HTML5 elements.

Known issue: If an element is created using the overridden createElement method this element returns a document fragment as its parentNode, but should be normally null. If a script relies on this behavior, shivMethodsshould be set to false. Note: jQuery 1.7+ has implemented his own HTML5 DOM creation fix for Internet Explorer 6-8. If all your scripts (including Third party scripts) are using jQuery's manipulation and DOM creation methods, you might want to set this option to false.

Configuring shivMethods before html5shiv.js is included.

//create a global html5 options object
window.html5 = {
	'shivMethods': false
};

Configuring elements after html5shiv.js is included.

//change the html5shiv options object 
window.html5.shivMethods = false;

html5.addElements( newElements [, document] )

The html5.addElements method extends the list of elements to shiv. The newElements argument can be a whitespace separated list or an array.

//extend list of elements to shiv
html5.addElements('element content');

html5.createElement( nodeName [, document] )

The html5.createElement method creates a shived element, even if shivMethods is set to false.

var container = html5.createElement('div');
//container is shived so we can add HTML5 elements using `innerHTML`
container.innerHTML = '<section>This is a section</section>';

html5.createDocumentFragment( [document] )

The html5.createDocumentFragment method creates a shived document fragment, even if shivMethods is set to false.

var fragment = html5.createDocumentFragment();
var container = document.createElement('div');
fragment.appendChild(container);
//fragment is shived so we can add HTML5 elements using `innerHTML`
container.innerHTML = '<section>This is a section</section>';

About

This script is the defacto way to enable use of HTML5 sectioning elements in legacy Internet Explorer.

Resources

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 100.0%