Responsive FAQ accordion

Community feedback

• 

  Dylan Heslop•1,570

  @dylan-dot-cPosted 1 day ago

  This is a great solution, it's accessible and well presented.

  I would like to know how you did the toggle animation as well as the will-change attribute.

  0

  ---

  

  Omiromir•50

  @OmiromirPosted about 18 hours ago

  @dylan-dot-c Hi, thx u for your question, i can say that, my toggle animation works by smoothly changing the opacity and max-height of the content when the aria-expanded attribute is toggled and the will-change property is used to optimize performance by telling the browser these properties will change, making the animation smoother.

  i hope, i answered clearly

  1

  

  Dylan Heslop•1,570

  @dylan-dot-cPosted about 17 hours ago

  @Omiromir thanks! Whenever I try to do the toggle animation by changing the height I normally set height 0 then height to a specific value say 100px that will work but the issue I had would be 100px might not be enough for all the contents of the drop-down, but I never thought about using max-height for the animations as that would make sense and say the height is 100px but you animate max-height to 10rem, so it will automatically go from 0-100px and not 0-10rem

  0