JSFiddle - React, Tailwind, and code Playground
by chintansoni
HTML
<div class="featureBoxes paddingRight">
<div class="featuresHeading features liList">
Div 1 Header
</div>
<div>
<div class="featureListings ">
<div>Div 1 Content
</div>
</div>
</div>
<div class="featuresHeading options liList">
Div 2 Header
</div>
<div>
<div class="featureListings">
<div> Div 2 Content
</div>
</div>
</div>
<div class="featuresHeading curtain-options liList">Div 3 Header
</div>
<div>
<div class="featureListings ">
<div>Div 3 Content
</div>
</div>
</div>
</div>
JavaScript
//sliding menu many time require
$(function () {
$("div.featureListings").hide();
$(".featuresHeading").click(function () {
$('div.featureListings.demo').slideUp(300);
$('div.featureListings.demo').not($(this).next().find('div.featureListings')).removeClass("demo");
if ($(this).next().find('div.featureListings').hasClass("demo")) {
$(this).next().find('div.featureListings').removeClass("demo");
$(this).next().find('div.featureListings').slideUp(300);
}
else {
$(this).next().find('div.featureListings').addClass("demo");
//$(this).next().find('ul.featureListings').slideToggle(300);
$(this).next().find('div.featureListings').slideDown(300);
}
return false;
});
});