no.js blog toggle menu
by ifedapoolarewaju
HTML
<script src="https://ifedapoolarewaju.github.io/nojs-site/no.min.js"></script>
<header>
<a no-js on-click-toggle-class=".sidemenu active">
<img src="https://github.com/ifedapoolarewaju/nojs/raw/master/example/menu.png" width="30px">
</a>
</header>
<div>Demo! Click the menu icon above</div>
<div class="sidemenu">
<div class="content">
<p>Blank content ...</p>
</div>
</div>
CSS
body {
font-family: sans-serif;
background: white;
color: black;
}
header {
height: 50px;
border-bottom: 1px #e0e0e0 solid;
margin-bottom: 10px;
}
.sidemenu {
position: absolute;
height: calc(100% - 56px);
top: 56px;
left: -360px;
width: 300px;
background: #e0e0e0;
padding: 0 30px;
transition: all ease 0.3s;
}
.sidemenu.active {
transform: translateX(360px);
}
JavaScript
// no javascript.