Home About
opening sidenav submenu programatically/by Marvin Herbold
  • Preview size
    Default Moto G4 Galaxy S5 Pixel 2 Pixel 2 XL iPhone 5/SE iPhone 6/7/8 iPhone 6/7/8 Plus iPhone X iPad iPad Pro Surface Duo Galaxy Fold
  • Settings
  • Change view
    standard view icon Standard view side view icon Side view project view icon Side-tab view Full screen view icon Full screen
  • HTML
  • CSS
  • JS
xxxxxxxxxx
 
1
<!-- Sidenav -->
2
<nav
3
  id="sidenav"
4
  class="sidenav"
5
  data-mdb-hidden="false"
6
  data-mdb-mode="side"
7
>
8
  <ul class="sidenav-menu">
9
    <li class="sidenav-item">
10
      <a class="sidenav-link">
11
        <i class="far fa-smile fa-fw me-3"></i><span>Link 1</span></a>
12
    </li>
13
    <li class="sidenav-item">
14
      <a class="sidenav-link"><i class="fas fa-grin fa-fw me-3"></i><span>Category 1</span></a>
15
      <ul class="sidenav-collapse">
16
        <li class="sidenav-item">
17
          <a class="sidenav-link">Link 2</a>
18
        </li>
19
        <li class="sidenav-item">
20
          <a class="sidenav-link">Link 3</a>
21
        </li>
22
      </ul>
23
    </li>
24
    <li class="sidenav-item">
25
      <a class="sidenav-link"><i class="fas fa-grin-wink fa-fw me-3"></i><span>Category 2</span></a>
26
      <ul class="sidenav-collapse">
27
        <li class="sidenav-item">
28
          <a class="sidenav-link">Link 4</a>
29
        </li>
30
        <li class="sidenav-item">
31
          <a class="sidenav-link">Link 5</a>
32
        </li>
33
      </ul>
34
    </li>
35
  </ul>
36
</nav>
37
<!-- Sidenav -->
1
 
1
​
xxxxxxxxxx
 
1
setTimeout( function () {
2
  const submenu = document.getElementById( "sidenav-collapse-1-0-0" );
3
  submenu.classList.add( "show" );
4
},
5
3000 );
Console errors: 0
Support