Basic
The basic HyperNav side navigation menu example. This navigation menu looks
the same on both mobile and desktop devices. In HyperNav the top and side
navigation menus work with the same markup, with the exception that the
class .hn-top has been replaced with .hn-side. This example features
only full expand items.
x
125
1
<nav class="hn-menu hn-side hn-width-100">2
<div class="hn-nav">3
<div class="hn-section hn-section-brand">4
<div class="hn-item">5
<a class="hn-link" href="#none">6
<span class="hn-content">7
Flowers8
</span>9
</a>10
</div>11
12
<div class="hn-expand">13
<input type="checkbox" class="hn-input-state" id="hn-roses-cb">14
15
<label class="hn-item hn-input" for="hn-roses-cb">16
<span class="hn-link">17
<span class="hn-content">18
Roses