如何使用MDBootstrap创建补充工具栏菜单

问题描述

我想创建一个侧面菜单，发现了这一点： https://mdbootstrap.com/docs/jquery/navigation/sidenav/

我从https://mdbootstrap.com/download/mdb-jquery/mdb-free/4191x8d4b2546b76217f/MDB-Free_4.19.1.zip下载了MDB库，并将其包括在我的项目中。

这是我的项目的代码：

<head>
    <link href="~/lib/MDB/css/mdb.min.css" rel="stylesheet" />
    <script src="~/lib/MDB/js/mdb.min.js"></script>
</head>
<body>
    <a href="#" data-activates="slide-out" class="btn btn-dark p-3 button-collapse">
            <i class="fas fa-bars"></i>
    </a>
    <!-- Sidebar navigation -->
    <div id="slide-out" class="side-nav2 side special-color-dark">
        <ul class="collapsible collapsible-accordion">
            <li><a class="collapsible-header waves-effect">Submit blog</a></li>
            <li><a class="collapsible-header waves-effect"> Instruction</a></li>
            <li><a class="collapsible-header waves-effect"> About</a></li>
            <li><a class="collapsible-header waves-effect"> Contact me</a></li>
        </ul>
        <div class="sidenav-bg"></div>
    </div>
<script>
    $(document).ready(function () {
        // SideNav Button Initialization
        $(".button-collapse").sideNav2();
        // SideNav Scrollbar Initialization
        var sideNavScrollbar = document.querySelector('.custom-scrollbar');
        var ps = new PerfectScrollbar(sideNavScrollbar);
    });
</script>
</body>

但是我什么都没发生:( 每个人都能发现我的错吗？...

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

bootstrap-4 mdbootstrap