Modernizr: An HTML5 Detection Library

Modernizr is an open source, MIT-licensed JavaScript library that detects support for many HTML5 and CSS3 features. At the time of writing, the latest version is 1.1. You should always use the latest version. To do so, include the following <script> element at the top of your page:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Dive into HTML5</title>
  <script src="modernizr.min.js"></script> 
</head>
<body>
  ...
</body>
</html>

Modernizr runs automatically. There is no modernizr_init() function to call. When it runs, it creates a global object called Modernizr that contains a set of Boolean properties for each feature it can detect. For example, if your browser supports the canvas API (see Chapter 4), the Modernizr.canvas property will be true. If your browser does not support the canvas API, the Modernizr.canvas property will be false:

if (Modernizr.canvas) {
  // let's draw some shapes!
} else {
  // no native canvas support available :(
}

Get HTML5: Up and Running now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial