DEV Community

Discussion on: React - create simple animated expander

Collapse
 
theonejonahgold profile image
Jonah Meijers

Did you know that you can make an expander using native HTML elements? With <details> and <summary> you don’t need any JavaScript to create the same result as above. With CSS you can style all parts of the details element, including the little dropdown arrow.

It’s sadly not animatable as the example you’re displaying, but it does alleviate a lot of unnecessary JavaScript, and it’s semantically correct(!!!) 😁

Here’s some more information about it: developer.mozilla.org/en-US/docs/W...

Collapse
 
diraskreact profile image
Dirask-React

Thank you for the tips! 😊πŸ”₯