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

Feedback for my JS script!!

@yudiyoshida

Desktop design screenshot for the FAQ accordion card coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


This challenge is awesome! I learned how to use the 'details' and 'summary' tags, I had no idea about them!

Also, this is my first challenge using Javascript, so I would really apreciate if you guys give me some feedbacks about my function, I know almost nothing about JS.

Thank you everybody and keep coding!

Community feedback

P
ApplePieGiraffe 30,545

@ApplePieGiraffe

Posted

Hi there, Yudi Yoshida! 👋

Nice work on this challenge! 🙌 Your solution looks good, responds well, and the accordion card functions nicely, too! 👏 It's great to hear that you learned and tried out new things for this challenge (I love the <details> and <summary> elements, too, since they things so much easier)! 😀

I think your JS looks fine—for larger projects, though, you might want to select and add event listeners to elements from the script.js file (rather than in your HTML) so that you can keep all of your JS in one place. 🙂

Also, just letting you know that you don't necessarily have to make the other tabs close when one FAQ is opened—users might want to have multiple tabs opened at the same time or not want open tabs to unexpectedly close. Just a thought! 😉

Keep coding (and happy coding, too)! 😁

1

AminBabu 250

@aminbabu

Posted

Obviously, you done some great job to your html and js code. A creative approach.

0

@yudiyoshida

Posted

@ApplePieGiraffe Hello! How are you? Thank you so much for your comment!

Initially I was doing this challenge without JS, but I got some problems when all questions were opened at the same time (overflow problems), that's why I decided to close all tabs.

And of course, your project is amazing! That box animation.. OMG!

Keep coding!

1
P
ApplePieGiraffe 30,545

@ApplePieGiraffe

Posted

@yudiyoshida

Haha, thanks! 😀

Just a tip—you could perhaps try allowing the height of the accordion to be dependent upon its content—that way, it should grow in size (not have overflow issues) when multiple tabs are opened. 😉

But, yes—keep coding, as well! 👍

1

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