Topic: Accordion arrows - down arrow for open tab on page load
I have an accordion with 3 tabs. When the page opens, the third tab is expanded - but the arrows for all tabs point down. Once you click on one of th tab headings, everything is displayed properly.
I'd expect the open tab to have the arrow pointing up, with the closed tabs' arrows pointing down.
Is there a simple way to change this?
Hi,
Could you recreate this problem in a snippet? In our docs all the examples seem to work properly.
Chris Sweeney pro premium commented 2 years ago
Thanks - have done so at https://mdbootstrap.com/snippets/jquery/sweens/4417238
Chris Sweeney pro premium commented 2 years ago
It appears that it works if the open tab is the first panel in the accordion, but fails if, for example, you want the 2nd or 3rd panel to be expanded when the page loads.
I've redesigned the page so the open panel is first!
Thank you for your snippet!
I've found a little bug in the code. You added .collapsed class to the link, which should not have following class.
Check out my snippet to see the solution: my-snippet
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Pro
- Premium support: Yes
- Technology: MDB Standard
- MDB Version: MDB5 4.4.0
- Device: all
- Browser: all
- OS: all
- Provided sample code: No
- Provided link: No