liAccordion / accordion
Google Maps

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();
})
</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="#"><span class="glyphicon glyphicon-map-marker"></span> Allison At The Flemington Office Park 555 East Street, New York City 12345</a>
		<ul>
			<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3022.2110334321387!2d-73.66563874041341!3d40.75738297932707!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x89c288053f421ccb%3A0x9daa617320607769!2zRWFzdCBTdCwgTmV3IEh5ZGUgUGFyaywgTlkgMTEwNDAsINCh0KjQkA!5e0!3m2!1sru!2sua!4v1446586529345" width="100%" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>
		</ul>
	</li>
	<li><a href="#"><span class="glyphicon glyphicon-map-marker"></span> Jason At New York City Office Park 555 West Street, New York City 12345</a>
		<ul>
			<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3022.2932425670247!2d-73.67126118426958!3d40.75557464288482!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x89c2881b97c84fa5%3A0xe2b181c022209e04!2zV2VzdCBTdCwgTmV3IEh5ZGUgUGFyaywgTlkgMTEwNDAsINCh0KjQkA!5e0!3m2!1sru!2sua!4v1446586572991" width="100%" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>
		</ul>
	</li>
	
	<li><a href="#"><span class="glyphicon glyphicon-map-marker"></span> Johnathan At The Islips Office Park 555 South Street, New York City 12345</a>
		<ul>
			<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3022.338002390629!2d-73.66805218426961!3d40.75459004294521!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x89c2881b501fbbc7%3A0x17f66d629392951b!2zU291dGggU3QsIE5ldyBIeWRlIFBhcmssIE5ZIDExMDQwLCDQodCo0JA!5e0!3m2!1sru!2sua!4v1446586600001" width="100%" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>
		</ul>
	</li>
</ul>