Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

a responsive Faq created using interactive JavaScript

@TheBeyonder616

Desktop design screenshot for the FAQ accordion coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
1newbie
View challenge

Design comparison


SolutionDesign

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

Community feedback

Levis Kim 1,180

@Orekihotarou-k

Posted

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

0

Please log in to post a comment

Log in with GitHub
Discord logo

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