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

Slide down nav


Introduction

Slidedown nav is a simple but effective top navigation that glides down from the top after a click on a menu button.

The basic colors are black and gray but can easily be adjusted with the color classes of css framework.


Click on the Class name to copy it.

slidedown-nav Main class for the slitedown nav block
slidedownclick Class for close button and open button click
closebtn Class for close button icon
slidedown-icon Class for open button icon
slidedown-nav-content Class for the contents of the slitedown nav
slidedown-main Class that make's the main area for the page content

Example Slitedown Nav pc - laptop

Example mobile


Example code:

<div class="slidedown-nav">
  <a href="javascript:void(0)" class="slidedownclick closebtn"></a>
  <div class="slidedown-nav-content">
    <a href="#">Home</a>
    <a href="#">About us</a>
    <a href="#">Our work</a>
    <a href="#">Contact</a>
  </div>
</div>

<a class="slidedownclick slidedown-icon" href="javascript:void(0)"></a>
<div class="slidedown-main">
  <h1 class="center">Header</h1>
</div>


© Copyright by Web Henkie
All right reserved
Webmaster