xxxxxxxxxx1
<div class="container my-4">2
3
<p>4
Detailed documentation and more examples you can find in our5
<a6
href="https://mdbootstrap.com/docs/standard/navigation/navbar/"7
target="_blank"8
><strong>Bootstrap Navbar Docs</strong></a9
> and 10
<a11
href="https://mdbootstrap.com/docs/b4/jquery/components/dropdowns/"12
target="_blank"13
><strong>Bootstrap Dropdown Docs</strong></a14
>15
</p>16
17
<hr class="mt-5">18
19
<p>Built with <a target="_blank" href="https://mdbootstrap.com/docs/standard/">Material Design for Bootstrap</a> - free and powerful Bootstrap UI KIT</p>20
21
<a class="btn btn-primary me-2" href="https://mdbootstrap.com/docs/standard/getting-started/installation/" target="_blank" role="button">Download MDB UI KIT <i class="fas fa-download"></i></a>22
<a class="btn btn-danger me-2" target="_blank" href="https://mdbootstrap.com/docs/standard/" role="button">Learn more</a>23
<a class="btn btn-success me-2" target="_blank" href="https://mdbootstrap.com/docs/standard/getting-started/" role="button">Tutorials</a>24
<a class="btn btn-dark me-2" target="_blank" href="https://github.com/mdbootstrap/mdb-ui-kit" role="button">GitHub <i class="fab fa-github ms-2"></i></a>25
26
<hr class="mb-5"/>27
28
<div class="container mt-5">29
<h1>First option</h1>30
<ul style="list-style-type:none">31
<li>32
<a href="#" type="button" id="dropdown" data-toggle="dropdown"class="dropdown multi-level-dropdown"33
aria-haspopup="true" aria-expanded="false"><i class="fas fa-ellipsis-v"></i></a>34
<ul style = "list-style-type:none"class="dropdown-menu mt-2 rounded-0 white border-0 z-depth-1">35
<li class="dropdown-item dropdown-submenu p-0">36
<a href="#" data-toggle="dropdown" class="dropdown-toggle dropdown-item w-100">Click Me! </a>37
<ul class="dropdown-menu rounded-0 white border-0 z-depth-1">38
<li class="dropdown-item p-0">39
<a href="#" class="dropdown-item w-100">Hey</a>40
</li>41
<li class="dropdown-item p-0">42
<a href="#" class="dropdown-item w-100">Hi</a>43
</li>44
<li class="dropdown-item p-0">45
<a href="#" class="dropdown-item w-100">Hello</a>46
</li>47
</ul>48
</li>49
<li class="dropdown-item dropdown-submenu p-0">50
<a href="#" data-toggle="dropdown" class="dropdown-toggle dropdown-item w-100">Click Me Too! </a>51
<ul class="dropdown-menu mr-2 rounded-0 white border-0 z-depth-1 r-100">52
<li class="dropdown-item p-0">53
<a href="#" class="dropdown-item w-100">How</a>54
</li>55
<li class="dropdown-item p-0">56
<a href="#" class="dropdown-item w-100">are</a>57
</li>58
<li class="dropdown-item dropdown-submenu p-0">59
<a href="#" data-toggle="dropdown" class="dropdown-toggle dropdown-item w-100">Click Me Too! </a>60
<ul style = "list-style-type:none"class="dropdown-menu mr-2 rounded-0 white border-0 z-depth-1 r-100 ">61
<li class="dropdown-item p-0">62
<a href="#" class="dropdown-item w-100">How</a>63
</li>64
<li class="dropdown-item p-0">65
<a href="#" class="dropdown-item w-100">are</a>66
</li>67
</ul>68
</li>69
</ul>70
</li>71
</ul>72
</li>73
</ul>74
<hr>75
<hr>76
<h1>Second Option</h1>77
<!--Navbar-->78
<nav class="navbar navbar-expand-lg navbar-dark primary-color">79
<!-- Navbar brand -->80
<a class="navbar-brand" href="#">Navbar</a>81
<!-- Collapse button -->82
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#basicExampleNav"83
aria-controls="basicExampleNav" aria-expanded="false" aria-label="Toggle navigation">84
<span class="navbar-toggler-icon"></span>85
</button>86
<!-- Collapsible content -->87
<div class="collapse navbar-collapse" id="basicExampleNav">88
<!-- Links -->89
<ul class="navbar-nav mr-auto">90
<li class="nav-item active">91
<a class="nav-link" href="#">Home92
<span class="sr-only">(current)</span>93
</a>94
</li>95
<li class="nav-item">96
<a class="nav-link" href="#">Features</a>97
</li>98
<li class="nav-item">99
<a class="nav-link" href="#">Pricing</a>100
</li>101
<!-- Dropdown -->102
<li class="nav-item dropdown multi-level-dropdown">103
<a href="#" id="menu" data-toggle="dropdown" class="nav-link dropdown-toggle w-100">Dropdown</a>104
<ul class="dropdown-menu mt-2 rounded-0 primary-color border-0 z-depth-1">105
<li class="dropdown-item dropdown-submenu p-0">106
<a href="#" data-toggle="dropdown" class="dropdown-toggle text-white w-100">Click Me Too! </a>107
<ul class="dropdown-menu ml-2 rounded-0 primary-color border-0 z-depth-1">108
<li class="dropdown-item p-0">109
<a href="#" class="text-white w-100">Hey</a>110
</li>111
<li class="dropdown-item p-0">112
<a href="#" class="text-white w-100">Hi</a>113
</li>114
<li class="dropdown-item dropdown-submenu p-0">115
<a href="#" data-toggle="dropdown" class="dropdown-toggle text-white w-100">Hello </a>116
<ul class="dropdown-menu mr-2 rounded-0 primary-color border-0 z-depth-1 r-100 ">117
<li class="dropdown-item p-0">118
<a href="#" class="text-white w-100">Some</a>119
</li>120
<li class="dropdown-item p-0">121
<a href="#" class="text-white w-100">Text</a>122
</li>123
</ul>124
</li>125
</ul>126
</li>127
<li class="dropdown-item dropdown-submenu">128
<a href="#" data-toggle="dropdown" class="dropdown-toggle text-white w-100">Click me </a>129
<ul class="dropdown-menu mr-2 rounded-0 primary-color border-0 z-depth-1 r-100 ">130
<li class="dropdown-item p-0">131
<a href="#" class="text-white w-100">How</a>132
</li>133
<li class="dropdown-item p-0">134
<a href="#" class="text-white w-100">are</a>135
</li>136
<li class="dropdown-item p-0">137
<a href="#" class="text-white w-100">you </a>138
</li>139
</ul>140
</li>141
</ul>142
</li>143
</ul>144
<!-- Links -->145
<form class="form-inline">146
<div class="md-form my-0">147
<input class="form-control mr-sm-2" type="text" placeholder="Search" aria-label="Search">148
</div>149
</form>150
</div>151
<!-- Collapsible content -->152
</nav>153
154
<!--/.Navbar-->155
<hr>156
<hr>157
158
<h1>Third option</h1>159
<!-- Navbar -->160
<nav class="navbar navbar-expand-lg navbar-dark pink darken-4">161
162
<!-- Navbar brand -->163
<a class="navbar-brand text-uppercase" href="#">Navbar</a>164
165
<!-- Collapse button -->166
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent2"167
aria-controls="navbarSupportedContent2" aria-expanded="false" aria-label="Toggle navigation">168
<span class="navbar-toggler-icon"></span>169
</button>170
171
<!-- Collapsible content -->172
<div class="collapse navbar-collapse" id="navbarSupportedContent2">173
174
<!-- Links -->175
<ul class="navbar-nav mr-auto">176
177
<!-- Features -->178
<li class="nav-item dropdown mega-dropdown active">179
<a class="nav-link dropdown-toggle text-uppercase" id="navbarDropdownMenuLink2" data-toggle="dropdown"180
aria-haspopup="true" aria-expanded="false">Features181
<span class="sr-only">(current)</span>182
</a>183
<div class="dropdown-menu mega-menu v-2 z-depth-1 pink darken-4 py-5 px-3"184
aria-labelledby="navbarDropdownMenuLink2">185
<div class="row">186
<div class="col-md-6 col-xl-3 sub-menu mb-xl-0 mb-4">187
<h6 class="sub-title text-uppercase font-weight-bold white-text">Featured</h6>188
<ul class="list-unstyled">189
<li>190
<a class="menu-item pl-0" href="#!">191
<i class="fas fa-caret-right pl-1 pr-3"></i>Lorem ipsum dolor sit amet192
</a>193
</li>194
<li>195
<a class="menu-item pl-0" href="#!">196
<i class="fas fa-caret-right pl-1 pr-3"></i>Consectetur adipiscing elit197
</a>198
</li>199
<li>200
<a class="menu-item pl-0" href="#!">201
<i class="fas fa-caret-right pl-1 pr-3"></i>Sed do eiusmod tempor incididunt202
</a>203
</li>204
<li>205
<a class="menu-item pl-0" href="#!">206
<i class="fas fa-caret-right pl-1 pr-3"></i>Ut labore et dolore magna207
</a>208
</li>209
<li>210
<a class="menu-item pl-0" href="#!">211
<i class="fas fa-caret-right pl-1 pr-3"></i>Ut enim ad minim veniam212
</a>213
</li>214
</ul>215
</div>216
<div class="col-md-6 col-xl-3 sub-menu mb-xl-0 mb-4">217
<h6 class="sub-title text-uppercase font-weight-bold white-text">Related</h6>218
<ul class="list-unstyled">219
<li>220
<a class="menu-item pl-0" href="#!">221
<i class="fas fa-caret-right pl-1 pr-3"></i>Quis nostrud exercitation222
</a>223
</li>224
<li>225
<a class="menu-item pl-0" href="#!">226
<i class="fas fa-caret-right pl-1 pr-3"></i>Duis aute irure dolor in227
</a>228
</li>229
<li>230
<a class="menu-item pl-0" href="#!">231
<i class="fas fa-caret-right pl-1 pr-3"></i>Laboris nisi ut aliquip ex ea commodo consequat232
</a>233
</li>234
<li>235
<a class="menu-item pl-0" href="#!">236
<i class="fas fa-caret-right pl-1 pr-3"></i>Reprehenderit in voluptate237
</a>238
</li>239
<li>240
<a class="menu-item pl-0" href="#!">241
<i class="fas fa-caret-right pl-1 pr-3"></i>Esse cillum dolore eu fugiat nulla pariatur242
</a>243
</li>244
</ul>245
</div>246
<div class="col-md-6 col-xl-3 sub-menu mb-md-0 mb-xl-0 mb-4">247
<h6 class="sub-title text-uppercase font-weight-bold white-text">Design</h6>248
<ul class="list-unstyled">249
<li>250
<a class="menu-item pl-0" href="#!">251
<i class="fas fa-caret-right pl-1 pr-3"></i>Excepteur sint occaecat252
</a>253
</li>254
<li>255
<a class="menu-item pl-0" href="#!">256
<i class="fas fa-caret-right pl-1 pr-3"></i>Sunt in culpa qui officia257
</a>258
</li>259
<li>260
<a class="menu-item pl-0" href="#!">261
<i class="fas fa-caret-right pl-1 pr-3"></i>Sed ut perspiciatis unde omnis iste natus error262
</a>263
</li>264
<li>265
<a class="menu-item pl-0" href="#!">266
<i class="fas fa-caret-right pl-1 pr-3"></i>Mollit anim id est laborum267
</a>268
</li>269
<li>270
<a class="menu-item pl-0" href="#!">271
<i class="fas fa-caret-right pl-1 pr-3"></i>Accusantium doloremque laudantium272
</a>273
</li>274
</ul>275
</div>276
<div class="col-md-6 col-xl-3 sub-menu mb-0">277
<h6 class="sub-title text-uppercase font-weight-bold white-text">Programming</h6>278
<ul class="list-unstyled">279
<li>280
<a class="menu-item pl-0" href="#!">281
<i class="fas fa-caret-right pl-1 pr-3"></i>Totam rem aperiam eaque282
</a>283
</li>284
<li>285
<a class="menu-item pl-0" href="#!">286
<i class="fas fa-caret-right pl-1 pr-3"></i>Beatae vitae dicta sun287
</a>288
</li>289
<li>290
<a class="menu-item pl-0" href="#!">291
<i class="fas fa-caret-right pl-1 pr-3"></i>Quae ab illo inventore veritatis et quasi292
architecto293
</a>294
</li>295
<li>296
<a class="menu-item pl-0" href="#!">297
<i class="fas fa-caret-right pl-1 pr-3"></i>Nemo enim ipsam voluptatem298
</a>299
</li>300
<li>301
<a class="menu-item pl-0" href="#!">302
<i class="fas fa-caret-right pl-1 pr-3"></i>Neque porro quisquam est303
</a>304
</li>305
</ul>306
</div>307
</div>308
</div>309
</li>310
<!-- Technology -->311
<li class="nav-item dropdown mega-dropdown">312
<a class="nav-link dropdown-toggle text-uppercase" id="navbarDropdownMenuLink3" data-toggle="dropdown"313
aria-haspopup="true" aria-expanded="false">Technology</a>314
<div class="dropdown-menu mega-menu v-2 z-depth-1 pink darken-4 py-5 px-3"315
aria-labelledby="navbarDropdownMenuLink3">316
<div class="row">317
<div class="col-md-12 col-xl-4 sub-menu mb-xl-0 mb-4">318
<h6 class="sub-title text-uppercase font-weight-bold white-text">Featured</h6>319
<!--Featured image-->320
<a href="#!" class="view overlay z-depth-1 p-0 mb-2">321
<img src="https://mdbootstrap.com/img/Photos/Horizontal/Work/8-col/img%20(37).jpg"322
class="img-fluid" alt="First sample image">323
<div class="mask rgba-white-slight"></div>324
</a>325
<a class="news-title font-weight-bold pl-0" href="#!">Lorem ipsum dolor sit</a>326
<p class="font-small text-uppercase white-text">327
<i class="fas fa-clock-o pr-2" aria-hidden="true"></i>July 17, 2017 / <i328
class="far fa-comments px-1" aria-hidden="true"></i> 20329
</p>330
</div>331
<div class="col-md-6 col-xl-4 sub-menu mb-md-0 mb-4">332
<h6 class="sub-title text-uppercase font-weight-bold white-text">Related</h6>333
<ul class="list-unstyled">334
<li>335
<a class="menu-item pl-0" href="#!">336
<i class="fas fa-caret-right pl-1 pr-3"></i>Quis nostrud exercitation337
</a>338
</li>339
<li>340
<a class="menu-item pl-0" href="#!">341
<i class="fas fa-caret-right pl-1 pr-3"></i>Duis aute irure dolor in342
</a>343
</li>344
<li>345
<a class="menu-item pl-0" href="#!">346
<i class="fas fa-caret-right pl-1 pr-3"></i>Laboris nisi ut aliquip ex ea commodo consequat347
</a>348
</li>349
<li>350
<a class="menu-item pl-0" href="#!">351
<i class="fas fa-caret-right pl-1 pr-3"></i>Reprehenderit in voluptate352
</a>353
</li>354
<li>355
<a class="menu-item pl-0" href="#!">356
<i class="fas fa-caret-right pl-1 pr-3"></i>Esse cillum dolore eu fugiat nulla pariatur357
</a>358
</li>359
</ul>360
</div>361
<div class="col-md-6 col-xl-4 sub-menu mb-0">362
<h6 class="sub-title text-uppercase font-weight-bold white-text">Design</h6>363
<ul class="list-unstyled">364
<li>365
<a class="menu-item pl-0" href="#!">366
<i class="fas fa-caret-right pl-1 pr-3"></i>Excepteur sint occaecat367
</a>368
</li>369
<li>370
<a class="menu-item pl-0" href="#!">371
<i class="fas fa-caret-right pl-1 pr-3"></i>Sunt in culpa qui officia372
</a>373
</li>374
<li>375
<a class="menu-item pl-0" href="#!">376
<i class="fas fa-caret-right pl-1 pr-3"></i>Sed ut perspiciatis unde omnis iste natus error377
</a>378
</li>379
<li>380
<a class="menu-item pl-0" href="#!">381
<i class="fas fa-caret-right pl-1 pr-3"></i>Mollit anim id est laborum382
</a>383
</li>384
<li>385
<a class="menu-item pl-0" href="#!">386
<i class="fas fa-caret-right pl-1 pr-3"></i>Accusantium doloremque laudantium387
</a>388
</li>389
</ul>390
</div>391
</div>392
</div>393
</li>394
<!-- Lifestyle -->395
<li class="nav-item dropdown mega-dropdown">396
<a class="nav-link dropdown-toggle text-uppercase" id="navbarDropdownMenuLink4" data-toggle="dropdown"397
aria-haspopup="true" aria-expanded="false">Lifestyle</a>398
<div class="dropdown-menu mega-menu v-2 z-depth-1 pink darken-4 py-5 px-3"399
aria-labelledby="navbarDropdownMenuLink4">400
<div class="row">401
<div class="col-md-6 col-xl-3 sub-menu mb-4">402
<h6 class="sub-title text-uppercase font-weight-bold white-text">Featured</h6>403
<ul class="list-unstyled">404
<li>405
<a class="menu-item pl-0" href="#!">406
<i class="fas fa-caret-right pl-1 pr-3"></i>Lorem ipsum dolor sit amet407
</a>408
</li>409
<li>410
<a class="menu-item pl-0" href="#!">411
<i class="fas fa-caret-right pl-1 pr-3"></i>Consectetur adipiscing elit412
</a>413
</li>414
<li>415
<a class="menu-item pl-0" href="#!">416
<i class="fas fa-caret-right pl-1 pr-3"></i>Sed do eiusmod tempor incididunt417
</a>418
</li>419
<li>420
<a class="menu-item pl-0" href="#!">421
<i class="fas fa-caret-right pl-1 pr-3"></i>Ut labore et dolore magna422
</a>423
</li>424
<li>425
<a class="menu-item pl-0" href="#!">426
<i class="fas fa-caret-right pl-1 pr-3"></i>Ut enim ad minim veniam427
</a>428
</li>429
</ul>430
</div>431
<div class="col-md-6 col-xl-3 sub-menu mb-4 mb-xl-0">432
<h6 class="sub-title text-uppercase font-weight-bold white-text">Related</h6>433
<!--Featured image-->434
<a href="#!" class="view overlay z-depth-1 p-0 mb-2">435
<img src="https://mdbootstrap.com/img/Photos/Horizontal/Work/6-col/img%20(43).jpg"436
class="img-fluid" alt="First sample image">437
<div class="mask rgba-white-slight"></div>438
</a>439
<a class="news-title font-weight-bold pl-0" href="#!">Lorem ipsum dolor sit</a>440
<p class="font-small text-uppercase white-text">441
<i class="fas fa-clock-o pr-2" aria-hidden="true"></i>July 17, 2017 / <i442
class="far fa-comments px-1" aria-hidden="true"></i> 20443
</p>444
</div>445
<div class="col-md-6 col-xl-3 sub-menu mb-md-0 mb-xl-0 mb-4">446
<h6 class="sub-title text-uppercase font-weight-bold white-text">Design</h6>447
<!--Featured image-->448
<a href="#!" class="view overlay z-depth-1 p-0 mb-2">449
<img src="https://mdbootstrap.com/img/Photos/Horizontal/Work/6-col/img%20(44).jpg"450
class="img-fluid" alt="First sample image">451
<div class="mask rgba-white-slight"></div>452
</a>453
<a class="news-title font-weight-bold pl-0" href="#!">Ut labore et dolore magna</a>454
<p class="font-small text-uppercase white-text">455
<i class="fas fa-clock-o pr-2" aria-hidden="true"></i>July 16, 2017 / <i456
class="far fa-comments px-1" aria-hidden="true"></i> 25457
</p>458
</div>459
<div class="col-md-6 col-xl-3 sub-menu mb-0">460
<h6 class="sub-title text-uppercase font-weight-bold white-text">Programming</h6>461
<ul class="list-unstyled">462
<li>463
<a class="menu-item pl-0" href="#!">464
<i class="fas fa-caret-right pl-1 pr-3"></i>Totam rem aperiam eaque465
</a>466
</li>467
<li>468
<a class="menu-item pl-0" href="#!">469
<i class="fas fa-caret-right pl-1 pr-3"></i>Beatae vitae dicta sun470
</a>471
</li>472
<li>473
<a class="menu-item pl-0" href="#!">474
<i class="fas fa-caret-right pl-1 pr-3"></i>Quae ab illo inventore veritatis et quasi475
architecto476
</a>477
</li>478
<li>479
<a class="menu-item pl-0" href="#!">480
<i class="fas fa-caret-right pl-1 pr-3"></i>Nemo enim ipsam voluptatem481
</a>482
</li>483
<li>484
<a class="menu-item pl-0" href="#!">485
<i class="fas fa-caret-right pl-1 pr-3"></i>Neque porro quisquam est486
</a>487
</li>488
</ul>489
</div>490
</div>491
</div>492
</li>493
<!-- Multi-level dropdown -->494
<li class="nav-item dropdown multi-level-dropdown">495
<a href="#" id="menu" data-toggle="dropdown" class="nav-link dropdown-toggle white-text " 496
>DROPDOWN</a>497
<ul class="dropdown-menu mt-2 rounded-0 pink darken-4 border-0 z-depth-1">498
<li class="dropdown-item dropdown-submenu p-0">499
<a href="#" data-toggle="dropdown" class="dropdown-toggle text-white w-100">Click Me Too! </a>500
<ul class="dropdown-menu ml-1 rounded-0 pink darken-4 border-0 z-depth-1">501
<li class="dropdown-item p-0">502
<a href="#" class="text-white w-100">Hey</a>503
</li>504
<li class="dropdown-item p-0">505
<a href="#" class="text-white w-100">Hi</a>506
</li>507
<li class="dropdown-item dropdown-submenu p-0">508
<a href="#" data-toggle="dropdown" class="dropdown-toggle text-white w-100">Hello </a>509
<ul class="dropdown-menu ml-1 rounded-0 pink darken-4 border-0 z-depth-1 r-100 ">510
<li class="dropdown-item p-0">511
<a href="#" class="text-white w-100">Some</a>512
</li>513
<li class="dropdown-item p-0">514
<a href="#" class="text-white w-100">Text</a>515
</li>516
</ul>517
</ul>518
</li>519
<li class="dropdown-item dropdown-submenu p-0">520
<a href="#" data-toggle="dropdown" class="dropdown-toggle text-white w-100">Click me </a>521
<ul class="dropdown-menu ml-1 rounded-0 pink darken-4 border-0 z-depth-1 r-100 ">522
<li class="dropdown-item p-0">523
<a href="#" class="text-white w-100">How</a>524
</li>525
<li class="dropdown-item p-0">526
<a href="#" class="text-white w-100">are</a>527
</li>528
<li class="dropdown-item p-0">529
<a href="#" class="text-white w-100">you </a>530
</li>531
</ul>532
</li>533
</ul>534
</li>535
536
</ul>537
538
<!-- Search form -->539
<form class="form-inline">540
<div class="md-form my-0">541
<input class="form-control mr-sm-2" type="text" placeholder="Search" aria-label="Search">542
</div>543
</form>544
545
</div>546
<!-- Collapsible content -->547
548
</nav>549
<!-- Navbar -->550
551
</div> 552
553
554
555
556
557
558
559
xxxxxxxxxx1
.dropdown-submenu {2
position: relative;3
}4
5
.dropdown-submenu>.dropdown-menu {6
top: 0;7
left: 100%;8
margin-top: -6px;9
margin-left: 1px;10
-webkit-border-radius: 0 6px 6px 6px;11
-moz-border-radius: 0 6px 6px;12
border-radius: 0 6px 6px 6px;13
}14
15
.dropdown-submenu:hover>.dropdown-menu {16
display: block;17
}18
19
.dropdown-submenu>a:after {20
display: block;21
content: " ";22
float: right;23
width: 0;24
height: 0;25
border-color: transparent;26
border-style: solid;27
border-width: 5px 0 5px 5px;28
border-left-color: #ccc;29
margin-top: 5px;30
margin-right: -10px;31
}32
33
.dropdown-submenu:hover>a:after {34
border-left-color: #fff;35
}36
37
.dropdown-submenu.pull-left {38
float: none;39
}40
41
.dropdown-submenu.pull-left>.dropdown-menu {42
left: 100%;43
margin-left: 10px;44
-webkit-border-radius: 6px 0 6px 6px;45
-moz-border-radius: 6px 0 6px 6px;46
border-radius: 6px 0 6px 6px;47
}48
xxxxxxxxxx1
2
$('.multi-level-dropdown .dropdown-submenu > a').on("mouseenter", function(e) {3
var submenu = $(this);4
$('.multi-level-dropdown .dropdown-submenu .dropdown-menu').removeClass('show');5
submenu.next('.dropdown-menu').addClass('show');6
e.stopPropagation();7
});8
9
$('.multi-level-dropdown .dropdown').on("hidden.bs.dropdown", function() {10
// hide any open menus when parent closes11
$('.multi-level-dropdown .dropdown-menu.show').removeClass('show');12
}); Console errors: 0