When your website means business.

CSS, jQuery, Responsive | Type: JavascriptResponsive jQuery Accordions (vertical expansion)

Nice responsive accordian.

HTML
<div class="accordion-container">
<a href="#" class="accordion-toggle">Rome <span class="toggle-icon"><i class="fa fa-plus-circle"></i></span></a>
	<div class="accordion-content">
		<img src="images/italy-thumb_rome.jpg" />
		<p>...</p>
	</div>
	<!--/.accordion-content-->
</div>
<!--/.accordion-container-->
(Repeat as necessary)

CSS
.accordion-container { width: 100%; margin: 0 0 20px; clear: both; }
.accordion-toggle { position: relative; display: block; padding: 20px; font-size: 1.5em; font-weight: 300; background: #999; color: #fff; text-decoration: none; }
.accordion-toggle.open { background: #333; color: #fff; }
.accordion-toggle:hover { background: #666; }
.accordion-toggle span.toggle-icon { 	position: absolute; top: 9px; right: 20px; font-size: 1.5em; }
.accordion-content { display: none; padding: 20px; overflow: auto; }
.accordion-content img { display: block; float: left; margin: 0 15px 10px 0; max-width: 100%; height: auto; }
 
/* media query for mobile */
@media (max-width: 767px) {
.accordion-content { padding: 10px 0; overflow: inherit; }
}

JQUERY
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery(function($) {
$(document).ready(function () {
    $('.accordion-toggle').on('click', function(event){
    	event.preventDefault();
    	// create accordion variables
    	var accordion = $(this);
    	var accordionContent = accordion.next('.accordion-content');
    	var accordionToggleIcon = $(this).children('.toggle-icon');
    	
    	// toggle accordion link open class
    	accordion.toggleClass("open");
    	// toggle accordion content
    	accordionContent.slideToggle(250);
    	
    	// change plus/minus icon
    	if (accordion.hasClass("open")) {
    		accordionToggleIcon.html("<i class='fa fa-minus-circle'></i>");
    	} else {
    		accordionToggleIcon.html("<i class='fa fa-plus-circle'></i>");
    	}
    });
});
});
</script>

Reference Links