Skip to main content

Accordion

Now, all the modern browsers are supporting <details> and <summary> tags. It's able to implement accordion functions and good for accessibility. Please check how to implement to accordion by using those tags.

No styles​

See the Pen by sushat4692 (@sushat4692) on CodePen.

With styles​

See the Pen by sushat4692 (@sushat4692) on CodePen.

With animations​

info

This example is using Web Animation API, but of course you can use jQuery animation instead.

See the Pen by sushat4692 (@sushat4692) on CodePen.