CSS3 Off Canvas Menu
I continue to be impressed and amazed at CSS3 transforms and transitions; they’re incredibly powerful and versatile. Perhaps what I most like about them is they can do things for your site that you used to rely on JavaScript for. For example, this off canvas menu found in the embedded CodePen would once likely have needed a slideToggle, or toggleClass to get the desired effect. Instead, we can now combined certain HTML structure, CSS3 transforms and the :target pseudoclass to do it.
You can also implement this in a way that will gracefully degrade back to IE. The off canvas menu example you see below is intended as a responsive mobile menu; something not used in IE8 and below. So simply select the off canvas with IE conditional classes and hide it.
See the Pen CSS3 Off Canvas Menu by Alec Morrison (@alphaalec) on CodePen.5891