To correctly discern what different browsers can do or not Moderniz does real feature detection. Some users change their userAgent string to get around weakly developed webpages which do not let them through otherwise, after all, the same rendering engine may not necessarily support the same things.

Using feature detection we can establish what we can and can’t do in the current browser, so Modernizr makes it suitable in numerous ways:

  • In just a blink it tests for over 40 next-generation features
  • It makes a JavaScript object containing results of these tests as boolean properties
  • It explains exactly what features are and are not supported by adding classes to the html element
  • Offers a script loader for you to pull in polyfills to backfill functionality in obsolete browsers

Let's see how Modernizr works

Modernizr makes its way by creating an element, setting a specific style instruction on that element and then instantly retrieving, so Browsers who understand the instruction will return something sensible, otherwise will return nothing or just ” undefined “.

To illustrate how you could use that specific test in your web development workflow as many tests in the documentation come with a small code sample. It’s very well know that the use of Modernizr is limited only by developers imagination so actual use cases come in multiple varieties.

Why use Modernizr?

Until you have to support browsers that lag behing taking advantages of great new web technologies is great fun. Whether a browser supports a feature or not Modernizr makes it easy for you to write conditional JavaScript and CSS to handle each situation