Design comparison
Solution retrospective
I did some weird tagging in my html, this made sense to my js code. but I know it was wrong. The labeling is as follows: class="a b c d" class="aa bb cc dd" class="aaaa bbb ccc ddd".
Community feedback
- @Ging3rmintPosted over 2 years ago
What you need to do is to get the event from the button click or the entire div wrapping the title, then look for its sibiling. you shouldn't need to use classes to identify them.
An example:
<div class='accordion'> <div class='accordion__header'> Title </div> <div> class='accordion__content'> Content </div> </div>With the markup shown above, add a click listener to the class 'accordion__header'. you will then receive an event from the click, use event.target to look for its sibiling. In Jquery you would use $(event.target).next() (i cannot remember the syntax for vanilla). Then, you can use the slideDown, slideUp or slideToggle to animate it.
0
Please log in to post a comment
Log in with GitHubJoin 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