flag
X logo
Menu
Home Icons Contact
Docs
Typography
Responsive
Containers Grid Align Display
Navigation
Topnav Sidenav Slide down nav Verticale nav Fullscreen nav Buttons Pagination
Pictures
Images Animation Parallax Sliteshow Thumbnail
Helpers
Helpers Padding Margin
More
Accordion Borders Cards Colors Form List Popup modal Table Tooltips

Verticale nav


Introductie

Vertnav is een eenvoudige maar effectieve verticale navigatie met submenuoptie.
Het heeft een breedte van 250px op de grotere schermen. Op schermen kleiner dan 400px heeft het een breedte van 100%.
De basiskleuren zijn zwart en grijs maar kunnen eenvoudig worden aangepast met de kleur classes van CSS-framework.

Klik op de Class naam om deze te kopiƫren.

vertnav Hoofd class voor het vertnav blok
acc Class voor klik gebeuren van de knoppen
dropbtn Class voor de open en sluit knop
down-icon Class voor het maken van het dropdown pictogram
drop-container Class voor de inhoud van de slitedown nav

Voorbeeld Vertical Nav pc - laptop

Voorbeeld mobiel


Voorbeeldcode:

<div class="vertnav">
  <a href="#">Home</a>
  <a href="#">Over ons</a>
  <a href="#">Ons werk</a>
  <a class="acc dropbtn" href="javascript:void(0)">Onze winkels<span class="down-icon"></span></a>
  <div class="drop-container">
    <a href="#">Amsterdam</a>
    <a href="#">Rotterdam</a>
  </div>
  <a href="#">Contact</a>
</div>


© Copyright by Web Henkie
All right reserved
Webmaster