liAccordion / accordion
Multi Level menu
Color templates
Select the desired color
Or set your custom color
Main Layout
Marker Shape
Marker Sign
Marker Position
Color Type
RESULT
Include files <head> ...[THIS CODE]... </head>
<!--If you have already use jquery, then this line is not necessary-->
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<!-- Plugins files-->
<link rel="stylesheet" href="css/liAccordion.css">
<script src="js/jquery.liAccordion.js"></script>
Custom CSS <style> ...[THIS CODE]... </style>
There will be generated CSS
Plugins Initialization <head> ...[THIS CODE]... </head>
<!-- Initialization of plugin -->
<script>
$(function(){
$('.ini_class').liAccordion({
clicablelink:true //It enables or disables the clickable links that have attachments
});
})
</script>
HTML <body> ...[THIS CODE]... </body>
<ul class="ini_class" data-colortheme="Pink" data-layout="menu" data-markershape="square" data-markersign="triangle" data-markerpos="left" data-colortype="bg">
<li>
<a href="#">Themeforest</a>
<ul>
<li>
<!-- Class "cur" opens this category -->
<a class="cur" href="#">All Items</a>
<ul>
<li><a href="#">Popular Files</a></li>
<li><a href="#">Featured Files</a></li>
<li><a href="#">Top New Files</a></li>
</ul>
</li>
<li>
<a href="#">WordPress</a>
<ul>
<li><a href="#">Popular Items</a></li>
<li><a href="#">All Items</a></li>
</ul>
</li>
<li>
<a href="#">HTML</a>
<ul>
<li><a href="#">Popular Items</a></li>
</ul>
</li>
</ul>
</li>
<li>
<a href="#">CodeCanyon</a>
<ul>
<li><a href="#">All Items</a>
<ul>
<li><a href="#">Popular Files</a></li>
<li><a href="#">Featured Files</a></li>
<li><a href="#">Top New Files</a></li>
<li><a href="#">Follow Feed</a></li>
</ul>
</li>
<li><a href="#">PHP Scripts</a>
<ul>
<li><a href="#">Popular Items</a></li>
<li><a href="#">All Items</a></li>
</ul>
</li>
</ul>
</li>
<li>
<a href="#">VideoHive</a>
<ul>
<li><a href="#">All Items</a>
<ul>
<li><a href="#">Popular Files</a></li>
<li><a href="#">Featured Files</a></li>
</ul>
</li>
<li><a href="#">After Effects Project Files</a>
<ul>
<li><a href="#">Popular Items</a></li>
<li><a href="#">All Items</a></li>
<li><a href="#">Broadcast Packages</a></li>
</ul>
</li>
</ul>
</li>
