更改由mmenu jQuery插件切片的元素

时间:2015-01-13 15:55:50

标签: jquery mmenu

我使用jQuery的mmenu插件在非画布菜单中创建幻灯片。我的问题是我有一个不理想的标记,并且没有页面包装器。结果是幻灯片页面放在错误的元素上,一切都变白了,我现在正试图改变它。

<body>
<nav id="menu" class="mm-menu mm-horizontal mm-offcanvas mm-right mm-front">
    <ul class="mm-list mm-panel mm-opened mm-current" id="mm-0">
        <li><a href="/">Home</a></li>
        <li><a class="mm-subopen" href="#mm-1"></a><a href="/about">About us</a></li>
        <li><a href="/contact">Contact</a></li>
    </ul>
    <!-- some more markup generated by the plugin -->
</nav>

<div class="mm-page mm-slideout" style="min-height: 949px;">
    <div id="DeltaPlaceHolderCustomizeSiteActionsAndQuickLaunch"></div>
    <div id="imgPrefetch" style="display:none">
        <img src="/_layouts/15/images/favicon.ico?rev=23">
        <img src="/_layouts/15/images/spcommon.png">
        <img src="/_themes/691/spcommon-B35BB0A9.themedpng?ctag=693">
    </div>
</div>

// more markup
</body>

这是生成的标记,根本不起作用,因为页面的内容不在获得mm-slideout类的div中。

我已尝试将pageNodeType(如此处所述)设置为将页面包装在较低级别(从body标记向下几层)的表单元素,如下所示:

$(document).ready(function () {
        var page = $('#aspnetForm');

        $("#menu").mmenu(
            {
                offCanvas: {
                    position: "right",
                    zposition: "front"
                }
            }, {
                offCanvas: {
                    pageNodeType: "form"
                }
            })
    });

并尝试了setting a specific element as the page,(如此处所述),如下所示:

 $("#menu").mmenu().trigger("setPage.mm", [page]);

但没有任何反应。我知道它正在被阅读,因为我可以将菜单的位置改为正确。

当我只做pageNoteType时。所有发生的事情是带有类mm-slideout的元素使用相同的类获取其中的另一个元素。但没有任何东西可以改变被滑落的东西。

我知道我的配置说页面不应该滑动,但是菜单应该滑过它,但据我所知,我仍然需要更改mm-page和mm-的内容幻灯片课程。当我打开菜单时,页面上的所有内容都变为白色。

1 个答案:

答案 0 :(得分:1)

pageNodeType应为pageNodetype(请注意小写字母t)。其余的看起来正确,应该这样做。