Solution using basic HTML, CSS, and JavaScript

Community feedback

• 

  Grego•1,310

  @Grego14Posted 7 months ago

  Hello! I have been reading the code of your challenge and here I leave you some recommendations:

  Set the alt attribute empty if the image does not have much meaning on the page. the same for the icons.

  I recommend that you create the eventListener outside of the forEach in the JavaScript code since you would be adding an eventListener for each element and it would be better if you use event delegation. If you don't know what it is, there are many articles that explain it.

  Event Delegation

  I hope this helps!

  Marked as helpful

  1

  ---

  

  Da•360

  @DaTheDumbGuyPosted 7 months ago

  @Grego14 Thank you! I appreciate it. ~(≧▽≦)/~

  0

  

  Da•360

  @DaTheDumbGuyPosted 7 months ago

  @Grego14 Hi, I did try changing the code base on your recommendations. I learned event delegation just last three or so days ago from YT[web simplified], and I guess learning and implementing it is really a different matter.

  Btw thanks again, and if you have time can you look at it again? thank you!

  0

  

  Grego•1,310

  @Grego14Posted 7 months ago

  @DaTheDumbGuy Hello! Now that I read it, it looks better!

  My last recommendation is that outside the click event you get the element that is currently showing the answer and after the user clicks, you check if it is equal to that one or not, if it is, nothing happens, if not, close that element and open the element that the user clicked. And so you wouldn't have to iterate over all the elements.

  But of course, after the user clicks on an element other than the previousElement, you have to make the previousElement change to the one the user clicked on, something like previousElement = clickedContainer

  also you could create a function to toggle the values ​​of the icon.src and the icon.alt.

  I hope this helps! 😁

  Marked as helpful

  1

  

  Da•360

  @DaTheDumbGuyPosted 7 months ago

  @Grego14 Hi again, hope I'm not bothering you Lol.

  I did change it like what you recommended, and sure it looks better. It seems I made it more complicated when the solution is quite simple.

  Anyway, thank you again~ your recommendation helps me a lot but all I can give you is upvote and like for your help.

  I didn't add function for the icon src and alt though, sorry! ԅ(¯﹃¯ԅ)

  1