Last active
December 15, 2015 15:39
-
-
Save rmdort/5283221 to your computer and use it in GitHub Desktop.
A simple Sidemenu for mobile. Using translate3d
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]--> | |
| <!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]--> | |
| <!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]--> | |
| <!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]--> | |
| <head> | |
| <meta charset="utf-8"> | |
| <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> | |
| <title></title> | |
| <meta name="description" content=""> | |
| <meta name="viewport" content="width=device-width"> | |
| <!-- Place favicon.ico and apple-touch-icon.png in the root directory --> | |
| <link rel="stylesheet" href="css/normalize.css"> | |
| <link rel="stylesheet" href="css/main.css"> | |
| <link rel="stylesheet" href="css/sidemenu.css"> | |
| <script src="js/vendor/modernizr-2.6.2.min.js"></script> | |
| </head> | |
| <body> | |
| <div class="container"> | |
| <button class="openMenu" type="button"> | |
| Open Menu | |
| </button> | |
| <nav class="sidemenu"> | |
| <ul class="nav"> | |
| <li><a href="#">Home</a></li> | |
| <li><a href="#">Get started</a></li> | |
| <li><a href="#">Scaffolding</a></li> | |
| <li><a href="#">Base CSS</a></li> | |
| <li><a href="#">Components</a></li> | |
| <li><a href="#">JavaScript</a></li> | |
| </ul> | |
| </nav> | |
| </div> | |
| <script> | |
| var $button = document.getElementsByClassName('openMenu')[0]; | |
| $button.addEventListener('click', function(){ | |
| document.body.classList.toggle('opened'); | |
| this.returnValue = false; | |
| }); | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment