What is modenizr and What is the use of it in Web development?


As we all know that HTML5 and CSS3 came with cool features, but before using it we must understand that browser implemented prior to HTML5 and CSS3 release does not support them & they are still used by users.

Modernizr is a JavaScript library that detects HTML5 and CSS3 features in the user's browser. 

To add Modernizr, download the file from official page. Then, on your website 's head tag, add a link to the file. For example:

<script src="path/to/modernizr-1.0.min.js"></script>

The second step is to include on your html tag a class "no-js" as shown below:

<html class="no-js">

For example:

<!DOCTYPE html>
<html class="no-js" lang="en">
	<title>Modernizr - JavaScript Example</title>
	<script src="path/to/modernizr.js"></script>
		if ( Modernizr.websockets ) {
                        alert("Your browser supports WebSockets");
		} else {
			alert("Your browser does not supports WebSockets");
	Modernizr - Example

Share this thread


comments powered by Disqus


Social Media