Page Description Published On
 Silence Your CSS Footprint With Sass Silent… Efficiently group your common styles together to reduce your CSS footprint in this Thinkful project..
 Sticking Components above the Fold Get stuck riding the bleeding edge with this unstable CSS3 feature
 Creating an Accessible to-do list powered by… Enhance a simple to–do list with React.js
 Adopting Orphans with   Up your typography game with the use of this single HTML entity
 Making your Markup Speak Using speakable.jquery.js you too can make your markup talk
 Loading Modernizr from a CDN Get the best of both worlds by loading Modernizr from a CDN near you
 Creating an Accessible Settings Table Create an accessible settings table using HTML5, CSS3, and a sprinkle of jQuery

Loading Modernizr from a CDN
with a local fallback

Modernizr is a lightweight feature detection library for HTML5 and CSS3. Odds are if you use it, you use it on just about everything you work on.

There is a good argument to not load Modernizr from a CDN at all. HTML5 Boilerplate doesn't, but let's say you want to:

<script src=""></script>
<script>try{Modernizr} catch(e) {document.write('<script src="./assets/js/vendor/modernizr-2.8.3.min.js"><\/script>')}</script>

This concept comes from HTML5 Boilerplate's technique of loading jQuery from a CDN with a local fallback. First, we attempt to load Modernizr from Cloudflare but in the event that requests fails we fallback to a local copy. This is done using the classic try…catch statement. If Modernizr failed to load from Cloudflare our try statement will fail given at that time Modernizr === undefined. Our catch statement would then execute and inject our local copy to the DOM using document.write().

Disqus This