Question

我使用此http://vadikom.github.io/smartmenus/src/demo/bootstrap-navbar.html作为我的长下拉菜单。但如何使子菜单下拉与父母一样，如下图所示？

这是我添加的js代码，但没有任何反应。谢谢你的帮助。

<script type="text/javascript">
   $(function() {
     $('#main-menu').smartmenus({
        subMenusSubOffsetX: 5,
        subMenusSubOffsetY: 20
     });
   });
</script>

这是html代码的一部分

<nav role="navigation" class="navbar navbar-fixed-top">
<div class="navbar-collapse collapse">
    <ul class="nav navbar-nav">
        <li class="navbar-left">
            <a href="#" onClick="loadData();">Home</a>                        
        </li>
        <li class="navbar-left">
            <a href="#">Menu</a>
            <ul class="dropdown-menu" id="main-menu">
                <li class=" row search-box">
                    <div class="col-sm-10">
                        <input class="form-control search" id="search-criteria" type="text" placeholder="Search"/>
                    </div>
                </li>
                <li>
                    <a class="menu" href="#">This submenu level 2<span class="caret"></span></a>
                    <ul class="dropdown-menu">
                        <li><a href="#">Menu item 1</a></li>
                        <li><a href="#">Menu item 2</a></li>
                        <li><a href="#">Menu item 3</a></li>
                        <li><a href="#">Menu item 4</a></li>
                        <li>
                            <a href="#">Menu item 5</a>
                                <ul class="dropdown-menu">
                                    <li><a href="#">Submenu item 1</a></li>
                                    <li><a href="#">Submenu item 2</a></li>
                                    <li><a href="#">Submenu item 3</a></li>
                                    <li><a href="#">Submenu item 4</a></li>
                                    <li><a href="#">Submenu item 5</a></li>
                                    <li><a href="#">Submenu item 6</a></li>
                                    <li><a href="#">Submenu item 7</a></li>
                                    <li><a href="#">Submenu item 8</a></li>
                                    <li><a href="#">Submenu item 9</a></li>
                                    <li><a href="#">Submenu item 10</a></li>
                                    <li><a href="#">Submenu item 11</a></li>
                                    <li><a href="#">Submenu item 12</a></li>
                                    <li><a href="#">Submenu item 13</a></li>
                                    <li><a href="#">Submenu item 14</a></li>
                                    <li><a href="#">Submenu item 15</a></li>
                                    <li><a href="#">Submenu item 16</a></li>
                                    <li><a href="#">Submenu item 17</a></li>
                                    <li><a href="#">Submenu item 18</a></li>
                                    <li><a href="#">Submenu item 19</a></li>
                                    <li><a href="#">Submenu item 20</a></li>
                                    <li><a href="#">Submenu item 1</a></li>
                                    <li><a href="#">Submenu item 2</a></li>
                                    <li><a href="#">Submenu item 3</a></li>
                                    <li><a href="#">Submenu item 4</a></li>
                                    <li><a href="#">Submenu item 5</a></li>
                                    <li><a href="#">Submenu item 6</a></li>
                                    <li><a href="#">Submenu item 7</a></li>
                                    <li><a href="#">Submenu item 8</a></li>
                                    <li><a href="#">Submenu item 9</a></li>
                                    <li><a href="#">Submenu item 10</a></li>
                                    <li><a href="#">Submenu item 11</a></li>
                                    <li><a href="#">Submenu item 12</a></li>
                                    <li><a href="#">Submenu item 13</a></li>
                                    <li><a href="#">Submenu item 14</a></li>
                                    <li><a href="#">Submenu item 15</a></li>
                                    <li><a href="#">Submenu item 16</a></li>
                                    <li><a href="#">Submenu item 17</a></li>
                                    <li><a href="#">Submenu item 18</a></li>
                                    <li><a href="#">Submenu item 19</a></li>
                                    <li><a href="#">Submenu item 20</a></li>
                                    <li><a href="#">Submenu item 1</a></li>
                                    <li><a href="#">Submenu item 2</a></li>
                                    <li><a href="#">Submenu item 3</a></li>
                                    <li><a href="#">Submenu item 4</a></li>
                                    <li><a href="#">Submenu item 5</a></li>
                                    <li><a href="#">Submenu item 6</a></li>
                                    <li><a href="#">Submenu item 7</a></li>
                                    <li><a href="#">Submenu item 8</a></li>
                                    <li><a href="#">Submenu item 9</a></li>
                                    <li><a href="#">Submenu item 10</a></li>
                                    <li><a href="#">Submenu item 11</a></li>
                                    <li><a href="#">Submenu item 12</a></li>
                                    <li><a href="#">Submenu item 13</a></li>
                                    <li><a href="#">Submenu item 14</a></li>
                                    <li><a href="#">Submenu item 15</a></li>
                                    <li><a href="#">Submenu item 16</a></li>
                                    <li><a href="#">Submenu item 17</a></li>
                                    <li><a href="#">Submenu item 18</a></li>
                                    <li><a href="#">Submenu item 19</a></li>
                                    <li><a href="#">Submenu item 20</a></li>
                                </ul>
                        </li>
                        <li><a href="#">Menu item 6</a></li>
                        <li><a href="#">Menu item 7</a></li>
                        <li><a href="#">Menu item 8</a></li>
                        <li><a href="#">Menu item 9</a></li>
                        <li><a href="#">Menu item 10</a></li>
                        <li><a href="#">Menu item 11</a></li>
                        <li><a href="#">Menu item 12</a></li>
                        <li><a href="#">Menu item 13</a></li>
                        <li><a href="#">Menu item 14</a></li>
                        <li><a href="#">Menu item 15</a></li>
                        <li><a href="#">Menu item 16</a></li>
                        <li><a href="#">Menu item 17</a></li>
                        <li><a href="#">Menu item 18</a></li>
                        <li><a href="#">Menu item 19</a></li>
                        <li><a href="#">Menu item 20</a></li>
                    </ul>
                </li>
                <li><a class="menu" href="#">Another Link<span class="caret"></span></a></li>
            </ul>
        </li>
    </ul>
</div>
</nav>

Smartmenus子菜单位置

0 个答案: