xxxxxxxxxx1
<!-- SideNav slide-out button -->2
<a href="#" data-activates="slide-out" class="btn btn-primary p-3 button-collapse"><i3
class="fas fa-bars"></i></a>4
5
<!-- Sidebar navigation -->6
<div id="slide-out" class="side-nav fixed sn-bg-1">7
<ul class="custom-scrollbar">8
<!-- Logo -->9
<li>10
<div class="logo-wrapper waves-light">11
<a href="#"><img src="https://mdbootstrap.com/img/logo/mdb-transparent.png"12
class="img-fluid flex-center"></a>13
</div>14
</li>15
<!--/. Logo -->16
<!--Social-->17
<li>18
<ul class="social">19
<li><a href="#" class="icons-sm fb-ic"><i class="fab fa-facebook-f"> </i></a></li>20
<li><a href="#" class="icons-sm pin-ic"><i class="fab fa-pinterest"> </i></a></li>21
<li><a href="#" class="icons-sm gplus-ic"><i class="fab fa-google-plus-g"> </i></a></li>22
<li><a href="#" class="icons-sm tw-ic"><i class="fab fa-twitter"> </i></a></li>23
</ul>24
</li>25
<!--/Social-->26
<!--Search Form-->27
<li>28
<form class="search-form" role="search">29
<div class="form-group md-form mt-0 pt-1 waves-light">30
<input type="text" class="form-control" placeholder="Search">31
</div>32
</form>33
</li>34
<!--/.Search Form-->35
<!-- Side navigation links -->36
<li>37
<ul class="collapsible collapsible-accordion">38
<li><a class="collapsible-header waves-effect arrow-r"><i class="fas fa-chevron-right"></i> Submit39
blog<i class="fas fa-angle-down rotate-icon"></i></a>40
<div class="collapsible-body">41
<ul>42
<li><a href="#" class="waves-effect">Submit listing</a>43
</li>44
<li><a href="#" class="waves-effect">Registration form</a>45
</li>46
</ul>47
</div>48
</li>49
<li><a class="collapsible-header waves-effect arrow-r"><i class="far fa-hand-pointer"></i>50
Instruction<i class="fas fa-angle-down rotate-icon"></i></a>51
<div class="collapsible-body">52
<ul>53
<li><a href="#" class="waves-effect">For bloggers</a>54
</li>55
<li><a href="#" class="waves-effect">For authors</a>56
</li>57
</ul>58
</div>59
</li>60
<li><a class="collapsible-header waves-effect arrow-r"><i class="fas fa-eye"></i> About<i61
class="fas fa-angle-down rotate-icon"></i></a>62
<div class="collapsible-body">63
<ul>64
<li><a href="#" class="waves-effect">Introduction</a>65
</li>66
<li><a href="#" class="waves-effect">Monthly meetings</a>67
</li>68
</ul>69
</div>70
</li>71
<li><a class="collapsible-header waves-effect arrow-r"><i class="far fa-envelope"></i> Contact me<i72
class="fas fa-angle-down rotate-icon"></i></a>73
<div class="collapsible-body">74
<ul>75
<li><a href="#" class="waves-effect">FAQ</a>76
</li>77
<li><a href="#" class="waves-effect">Write a message</a>78
</li>79
<li><a href="#" class="waves-effect">FAQ</a>80
</li>81
<li><a href="#" class="waves-effect">Write a message</a>82
</li>83
<li><a href="#" class="waves-effect">FAQ</a>84
</li>85
<li><a href="#" class="waves-effect">Write a message</a>86
</li>87
<li><a href="#" class="waves-effect">FAQ</a>88
</li>89
<li><a href="#" class="waves-effect">Write a message</a>90
</li>91
</ul>92
</div>93
</li>94
</ul>95
</li>96
<!--/. Side navigation links -->97
</ul>98
<div class="sidenav-bg rgba-blue-strong"></div>99
</div>100
<!--/. Sidebar navigation -->1
1
xxxxxxxxxx1
$(document).ready(function() {2
// SideNav Button Initialization3
$(".button-collapse").sideNav();4
// SideNav Scrollbar Initialization5
var sideNavScrollbar = document.querySelector('.custom-scrollbar');6
var ps = new PerfectScrollbar(sideNavScrollbar);7
}); Console errors: 0