liAccordion / accordion
Last News
Color templates
Main Layout
Marker Shape
Marker Sign
Marker Position
Color Type
RESULT
-
By Stephen BrockIn Business, Design Posted May 24, 2013
CURABITUR AC NEQUE AT ARCU
Mauris sed mauris bibendum est imperdiet porttitor tincidunt at lorem. Pendisse blandit ligula turpis, ac convallis risus fermentum non. Duis vestibulum quis quam vel accumsan. Nunc a vulputate lectus. Vestibulum eleifend nisl sed massa sagittis vestibulum. Vestibulum pretium blandit tellus ...
-
By Stephen BrockIn Business, Design Posted May 24, 2013
CURABITUR AC NEQUE AT ARCU
Mauris sed mauris bibendum est imperdiet porttitor tincidunt at lorem. Pendisse blandit ligula turpis, ac convallis risus fermentum non. Duis vestibulum quis quam vel accumsan. Nunc a vulputate lectus. Vestibulum eleifend nisl sed massa sagittis vestibulum. Vestibulum pretium blandit tellus ...
-
By Stephen BrockIn Business, Design Posted May 24, 2013
CURABITUR AC NEQUE AT ARCU
Mauris sed mauris bibendum est imperdiet porttitor tincidunt at lorem. Pendisse blandit ligula turpis, ac convallis risus fermentum non. Duis vestibulum quis quam vel accumsan. Nunc a vulputate lectus. Vestibulum eleifend nisl sed massa sagittis vestibulum. Vestibulum pretium blandit tellus ...
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>
Plugins Initialization <head> ...[THIS CODE]... </head>
<!-- Initialization of plugin -->
<script>
$(function(){
$('.ini_class').liAccordion({
onlyOne:false
});
})
</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="#">
<img src="pic/logo.png" class="lastNewsThumb">
<div class="lastNewsCont">
<div class="lastNewsItemInfo"><i>By <b>Stephen BrockIn</b> Business, Design Posted May 24, 2013</i></div>
<h5>CURABITUR AC NEQUE AT ARCU</h5>
</div>
</a>
<ul>
<p>Mauris sed mauris bibendum est imperdiet porttitor tincidunt at lorem. Pendisse blandit ligula turpis, ac convallis risus fermentum non. Duis vestibulum quis quam vel accumsan. Nunc a vulputate lectus. Vestibulum eleifend nisl sed massa sagittis vestibulum. Vestibulum pretium blandit tellus ...</p>
<div class="text-right"><button class="btn btn-default" href="#">Read More</button></div>
</ul>
</li>
<li>
<a href="#">
<img src="pic/logo.png" class="lastNewsThumb">
<div class="lastNewsCont">
<div class="lastNewsItemInfo"><i>By <b>Stephen BrockIn</b> Business, Design Posted May 24, 2013</i></div>
<h5>CURABITUR AC NEQUE AT ARCU</h5>
</div>
</a>
<ul>
<p>Mauris sed mauris bibendum est imperdiet porttitor tincidunt at lorem. Pendisse blandit ligula turpis, ac convallis risus fermentum non. Duis vestibulum quis quam vel accumsan. Nunc a vulputate lectus. Vestibulum eleifend nisl sed massa sagittis vestibulum. Vestibulum pretium blandit tellus ...</p>
<div class="text-right"><button class="btn btn-default" href="#">Read More</button></div>
</ul>
</li>
<li>
<a href="#">
<img src="pic/logo.png" class="lastNewsThumb">
<div class="lastNewsCont">
<div class="lastNewsItemInfo"><i>By <b>Stephen BrockIn</b> Business, Design Posted May 24, 2013</i></div>
<h5>CURABITUR AC NEQUE AT ARCU</h5>
</div>
</a>
<ul>
<p>Mauris sed mauris bibendum est imperdiet porttitor tincidunt at lorem. Pendisse blandit ligula turpis, ac convallis risus fermentum non. Duis vestibulum quis quam vel accumsan. Nunc a vulputate lectus. Vestibulum eleifend nisl sed massa sagittis vestibulum. Vestibulum pretium blandit tellus ...</p>
<div class="text-right"><button class="btn btn-default" href="#">Read More</button></div>
</ul>
</li>
