Skip to content
Submitted 12 months ago

a responsive Faq created using interactive JavaScript

Peter Godspower•710
@TheBeyonder616
A solution to the FAQ accordion challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

What are you most proud of, and what would you do differently next time?

completing the project

What challenges did you encounter, and how did you overcome them?

well creating the independent function

What specific areas of your project would you like help with?

an advice would do

Code

Please log in to post a comment

Log in

Community feedback

  • Levis Kim•1,230
    @Orekihotarou-k

    Hey @TheBeyonder616. Great job completing the challenge

    Here's a few tips to make your project better Improve Accessibility: Wrap each FAQ question in a <button> element instead of just using <h2>. This will enhance accessibility, making it easier for users to navigate with a keyboard.

    Simplify Image Handling: Instead of switching between two image sources using JavaScript, you can manage the display of the plus and minus icons with CSS classes. This will simplify your code and make it more maintainable.

    Avoid Repetitive Code: Consider combining the updateImageSrc and toggleFAQ logic into a single function. This will reduce code repetition and make your script more efficient.

    Use Event Delegation: Rather than attaching an event listener to each individual FAQ, add a single event listener to a parent element. This way, it can handle clicks on all FAQs, simplifying your code.

    Enhance Readability: Rename your variables for better clarity. For example, instead of faqAnswers, use answers. Clearer variable names make your code easier to understand and maintain.

    Marked as helpful

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