This project is not meant to degrade gracefully on older browsers, so we need to apply a different technique to detect when features essential to this project are missing and provide an alternative CSS2 stylesheet.
For this, we rely on a JavaScript library called
Modernizr.js
(http://modernizr.com/), which shows methods for each HTML5/CSS3 feature. These methods simply return true
or false
depending on the presence of the desired feature. Then, we are going to use a small library included in Modernizr.js
, called yepnope.js, (http://yepnopejs.com) to dynamically choose which stylesheet we want to load.
First of all, we need to download the library. To do so, we have to mark the checkboxes corresponding to which features we want to test, from the download page at http://modernizr.com/download/. Let's mark border-radius, box-shadow, CSS Gradients, and multiple backgrounds. Then, hit the
Generate button, and then the Download button, saving the file as modernizr.js
...