Top Drawer – A smooth dropdown menu for responsive web design

CSS - Responsive / Added on January 25, 2013 / Add to favorites

This tutorial demonstrates how to create a smoother reveal mobile menu using CSS3 rather than animating it with JavaScript. Once you click the menu icon, the click event will assign the class of active to the drawer container which alters the translate value to bring the drop-down menu nice and smoothly into view.
Modernizr will detect whether the user's device is capable of CSS transforms, if it isn't the menu will simply show and hide the menu after the button is pressed.
Top Drawer - A smooth dropdown menu for responsive web design