Github Project - Version 2.5.0
Created & Maintained by Gary Hepting

Navigation

Responsive navigation created by Gary Hepting

Component Usage Example 4 of 14

Target Breakpoints

iPad


<nav class="nav" title="iPad Menu">
  <ul>
    <li><button>Nav Item 1</button></li>
    <li><button>Nav Menu 1</button>
      <ul>
        <li><button>Menu Item 1</button></li>
        <li><button>Sub Menu 1</button>
          <ul>
            <li><button>Sub Menu Item 1</button></li>
            <li><button>Sub Menu Item 2</button></li>
          </ul>
        </li>
        <li><button>Menu Item 2</button></li>
      </ul>
    </li>
    <li><button>Nav Item 3</button></li>
  </ul>
</nav>

Small Tablet


<nav class="nav small-tablet" title="Small Tablet Menu">...</nav>

Mobile


<nav class="nav mobile" title="Mobile Menu">...</nav>

Vegetarian (No Hamburger)


<nav class="nav nocollapse" title="Vegetarian Menu">...</nav>

Colors



Vertical Orientation

iPad


<nav class="nav vertical" title="Vertical iPad Menu">...</nav>

Small Tablet


<nav class="nav small-tablet vertical" title="Vertical Small-Tablet Menu">...</nav>

Mobile


<nav class="nav mobile vertical" title="Vertical Mobile Menu">...</nav>

Vegetarian (No Hamburger)


<nav class="nav vertical nocollapse">...</nav