DEV Community

loading...

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 Author

Thank you for the tips! 😊πŸ”₯