Skip to content
Submitted over 1 year ago

Responsive FAQ Accordion Card

Raink31•340
@Raink31
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...FAQ accordion card
  • HTML
  • CSS
  • JS
1newbie

Design comparison

SolutionDesign

Solution retrospective

Hi everyone,

As my second solo javascript project, I struggled a bit on this one.

Do you have come advices to have less javascript in the project ?

Thanks !

Community feedback

  • Vanza Setia•27,775
    @vanzasetiaPosted over 1 year ago

    Hi, Raink31!

    I recommend using the native HTML elements to create the accordions, <summary> and <details>. These elements have already built-in toggle functionality. If you use them, you do not need to code the toggle functionality.

    Also, I recommend using querySelectorAll to select all the accordions. Then, use forEach to target each element. Those can be used to create a functionality to only allow users to open one accordion panel at a time. This way, you don't have to select each individual element using querySelector.

    I hope this helps.

    0

Please log in to post a comment

Log in with GitHub

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord