Submit your widget

Gooey menu plugin with jQuery

Created about a year ago   Views 14138   downloads 2247    Author dominicdomu
Gooey menu plugin with jQuery
View DemoDownload 580.1 KB
31
Share |

jquery gooey menu pluggins,Easily customizable jQuery plugin using SVG filters

The introduction gooey.min.css,jquery and gooey.min.js

<link rel="stylesheet" href="gooey.min.css">
<script src="js/jquery.min.js"></script>
<script src="js/gooey.min.js"></script>    
<nav id="gooey-upper">
  <input type="checkbox" class="menu-open" name="menu-open1" id="menu-open1"/>

  <label class="open-button" for="menu-open1">
    <span class="burger burger-1"></span>
    <span class="burger burger-2"></span>
    <span class="burger burger-3"></span>
  </label> 

HTML 

  <a href="#features" class="gooey-menu-item"> 
    <i title="Features" class="fa fa-cog fa-2x"></i> 
  </a>
  <a href="#h-spaced-menu" class="gooey-menu-item"> 
    <i title="Horizontal Menu" class="fa fa-arrows-h fa-2x"></i> 
  </a>
  <a href="#menu-v-example" class="gooey-menu-item"> 
    <i title="Vertical Menu" class="fa fa-arrows-v fa-2x"></i> 
  </a>
  <a href="#docs" class="gooey-menu-item"> 
    <i title="Docs" class="fa fa-book fa-2x"></i> 
  </a>
  <a href="#event-api" class="gooey-menu-item"> 
    <i title="Event API" class="fa fa-code fa-2x"></i> 
  </a>
  <a href="#round" class="gooey-menu-item"> 
    <i title="Round Menu" class="fa fa-circle fa-2x"></i> 
  </a>
 </nav>