Incoded Animated Menu Component

Incoded Animated Menu Component


Incoded Animated Menu Component is HTML/CSS/JS web page element made as to look nice and fancy on your website as to be functional and provide complete user experience. It is responsive fullscreen menu that supports submenus as well so it’s going to be a good solution for mobile platforms too.


Ivan Mitic email website
Dalibor Petrovic email behance


  • 16 themes
  • 8 fonts
  • 4 animations
  • Submenus
  • Responsive
  • Hamburger button positioning
  • Background opacity


  • jQuery

Quick Setup

Include animenu.min.css file before </head> tag of your page:

<link rel="stylesheet" type="text/css" media="screen" href="css/animenu.min.css">

Add the following HTML anywhere inside the tag on your page and change its links according to your needs:

<div id="menu"> <ul> <li><a href="#">Home</a></li> <li><a href="#">About us</a></li> <li class="iamenu-sub"><a href="#">Our clients</a> <ul> <li><a href="#">Asana</a></li> <li><a href="#">Basecamp</a></li> <li><a href="#">Jira</a></li> <li><a href="#">Teamwork</a></li> <li><a href="#">Wunderlist</a></li> </ul> </li> <li><a href="#">Process</a></li> <li><a href="#">Contact</a></li> </ul>

Include these javascript files before tag of your page:

<script src="js/jquery.min.js"></script>
<script src="js/animenu.min.js"></script>

Menu Instance
Create menu instance after previously included JavaScript files:

<script type="text/javascript">
$(function(){ new IncodedAniMenu('#menu');

Full Documentation


v1.0.5 November 30, 2015

  • Fixed menu position
  • Fixed gap between hamburger bars and on close button

v1.0.4 November 10, 2015

  • A small bug fixed

v1.0.3 October 30, 2015

  • Added new option – “opacity”
  • Improved option – “button_position”

v1.0.1 October 25, 2015

  • Set default font

v1.0.0 October 22, 2015

  • Realeased

More items by incoded

Incoded Animated Menu Component Incoded JSON Menu Component