Question

I want to use modernizr.js with my website.
How does it work?
How does it communicate with other js files?
How can I use it?

Does it work in Mobile Application Development with PhoneGap?

Answer 1

Modernizr runs quickly on page load to detect features; it then
creates a JavaScript object with the results, and adds classes to the
html element for you to key your CSS on. Modernizr supports dozens of
tests, and optionally includes YepNope.js for conditional loading of
external .js and .css resources.

Yes, it does work with phonegap. Usually what modernizr does is just check if the “browser” has teh specific property and apply a class to the html tag. so you can create styles for browsers that support and browsers that dont support the feature in question.

eg

cssmasks .icon {
    width: 60px;
    height: 60px;
    margin: 0 auto;
    background-color: #ffcc33;
    display: inline-block;
}
.no-cssmasks .icon {
    width: 60px;
    height: 60px;
    margin: 0 auto;
    display: inline-block;
    background-image: url('http://i.cubeupload.com/VvBVjp.png'); 
}
.cssmasks .icon-note{
    -webkit-mask-image: url('http://i.cubeupload.com/VvBVjp.png'); 
}