// Accordion by WebSensePro.com $(function() { // (Optional) Active an item if it has the class "is-active" $(".accordion > .accordion-item.is-active").children(".accordion-panel").slideDown(); $(".accordion > .accordion-item").click(function() { // Cancel the siblings $(this).siblings(".accordion-item").removeClass("is-active").children(".accordion-panel").slideUp(); // Toggle the item $(this).toggleClass("is-active").children(".accordion-panel").slideToggle("ease-out"); }); });
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter