A lite version vertical animated menu powered with CSS3 and jQuery. The menu comes with colorful & full height vertical bars that expand to full screen on click event.
Plugin Preview
How to start using jQuery?
More jQuery Top, Best and New Plugins
Top 100 jQuery Plugins
Plugin Overview
Plugin: | vertical-animated-menu |
Author: | Rudy Sanchez |
Licence: | MIT Licence |
Published: | January 12, 2024 |
Repository: | Fork on GitHub |
Dependencies: | jQuery 1.3.1 or Latest version and jQuery UI 1.12.0 or Latest |
File Type: | zip archive (HTML, CSS & JavaScript) |
Package Size: | 3 KB |
How to Use Vertical Animated Menu :
1. Load the jQuery
and jQuery UI
into your HTML document in order to use vertical animated menu .
<!-- jQuery --> <script src="https://code.jquery.com/jquery-3.4.0.min.js"></script> <!-- jQuery UI --> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
2. After this, include the vertical menu
‘s CSS and JavaScript file into your page.
<!-- Vertical Menu CSS --> <link rel="stylesheet" href="css/menu.css"> <!-- Vertical Menu Js --> <script src="js/menu.js"></script>
3. Create HTML structure for vertical animated menu like below and done.
<div id="wrap"> <div class="strip" id="optionOne"> <p>Option 1</p> </div> <div class="strip" id="optionTwo"> <p>Option 2</p> </div> <div class="strip" id="optionThree"> <p>Option 3</p> </div> <div class="strip" id="optionFour"> <p>Option 4</p> </div> <div class="strip" id="optionFive"> <p>Option 5</p> </div> <div class="strip" id="optionSix"> <p>Option 6</p> </div> </div>
Similar Code Snippets:
I code and create web elements for amazing people around the world. I like work with new people. New people new Experiences.
I truly enjoy what I’m doing, which makes me more passionate about web development and coding. I am always ready to do challenging tasks whether it is about creating a custom CMS from scratch or customizing an existing system.