3D Dropdown Menu Animation In CSS

File Size:14.69 KB
Views Total:608
Last Update:December 25, 2017
Publish Date:December 25, 2017
Official Website:Go to website
License:MIT

In css 3d drop down Menu is a light weight Jquery plugin used to create a drop down menu with cool animation effects with help of toggle button open & close menu dropdown with effects.

How It Use : 

1.  Use and include the files Jquery & Css Links :

<link rel="stylesheet" href="css/style.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script src="js/makisu.js"></script>

2. Use and include the files Html :

<ul class="list">
            <li>Maki</li>
            <li><a href="#">Ana-kyu</a></li>
            <li><a href="#">Chutoro</a></li>
            <li><a href="#">Kaiware</a></li>
            <li><a href="#">Kampyo</a></li>
            <li><a href="#">Kappa</a></li>
            <li><a href="#">Natto</a></li>
            <li><a href="#">Negitoro</a></li>
            <li><a href="#">Oshinko</a></li>
            <li><a href="#">Otoro</a></li>
            <li><a href="#">Tekka</a></li>
</ul>

3.  Use and include the files jQuery plugin Options :

$( '.list' ).makisu({
    selector: 'li',
    overlap: 0.2,
    speed: 0.8
});

Done 🙂