Topic: How can I set the active state in the sideNav?
When I use the sideNav, I could add a class 'active' to the 'collapsible-header' to make it expand. How can I make the 'collapsible-body' item active using jQuery?
Start your code here
<li>
<a class="collapsible-header waves-effect arrow-r active">
Server
<i class="fa fa-angle-down rotate-icon"></i>
</a>
<div class="collapsible-body">
<ul>
<li>
<a href="#" class="waves-effect">GP</a>
</li>
<li>
<a href="#" class="waves-effect">NA</a>
</li>
</ul>
</div>
</li>
Add comment
Hi,
You can make it using the following code:
<li><a class="show-me collapsible-header waves-effect arrow-r"><i class="fa fa-chevron-right"></i> Submit blog<i class="fa fa-angle-down rotate-icon"></i></a> <div class="collapsible-body"> <ul> <li><a href="#" class="waves-effect">Submit listing</a> </li> <li><a href="#" class="waves-effect">Registration form</a> </li> </ul> </div> </li>and then:
// SideNav Button Initialization
$(".button-collapse").sideNav();
// SideNav Scrollbar Initialization
var sideNavScrollbar = document.querySelector('.custom-scrollbar');
Ps.initialize(sideNavScrollbar);
$('.show-me').click();
Best Regards
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Status
Answered
Specification of the issue
- ForumUser: Premium
- Premium support: Yes
- Technology: MDB jQuery
- MDB Version: -
- Device: -
- Browser: -
- OS: -
- Provided sample code: Yes
- Provided link: No
Tags