Skip to content
OverviewSolutions
25
Comments
4
Cletus Samuel
@CletsyMedia

All comments

  • Orton Bright•310
    @ortonb110Submitted about 1 year ago

    Hi there 👋, I’m Orton and this is my solution for this challenge.

    Built With:

    TailwindCSS npm - prettier React.js, HowlerJS, Framer-Motion, Axios. Any suggestions on how I can improve are welcome!

    Thank you. 😊✌️

    Responsive Dictionary App

    2
    Cletus Samuel•590
    @CletsyMediaPosted about 1 year ago

    Nice job man

    Marked as helpful
    0
  • Cletus Samuel•590
    @CletsyMediaPosted over 1 year ago

    Thanks for the review.

    0
  • Blerim•270
    @approved4meSubmitted almost 2 years ago

    I am still struggling with the JavaScript for the accordion. I have managed to close other items, when another accordion item is opened, but I haven't found out how to close the current accordion item, when clicking it directly.

    If anyone knows how to close the active menu when clicking on it, please let me know.

    Thanks for viewing.

    FAQ accordion card

    2
    Cletus Samuel•590
    @CletsyMediaPosted almost 2 years ago

    Clear the active CSS you used for JS and add this to your CSS /* Correction / .accordion_answer { max-height:0; overflow: hidden; transition:max-height 1.4s ease; } .active .accordion_answer{ max-height:10rem; } .active .arrow{ transform: rotate(180deg); } .active .accordion_question{ color: #000; } .arrow { transition: 350ms all; } / Correction End*/

    Delete your JS code and add this js code to it and it will solve the issue // Solution const answer = document.querySelectorAll(".accordion_element");

    answer.forEach(answer =>{ answer.addEventListener("click", ()=>{ answer.classList.toggle("active") }) }); If it solves the issue, hola at me. Happy holidays!🥂🍻

    0
  • Cletus Samuel•590
    @CletsyMediaPosted almost 2 years ago

    Check my solution it will help fix it.

    1