Question

我的菜单结构如下：

<nav id="header-bar-menu-wrapper" class="show-for-large">
        <ul id="header-bar-menu">
          <li>
            <a href="">Link 1</a>
          </li>

并使用mmenu克隆如下：

var $menu = $("#header-bar-menu-wrapper").mmenu({
    // options
}, {
    // configuration
    clone: true
});

我希望原始菜单在桌面上可见，并且仅在平板电脑/移动设备上使用mmenu。

由于我使用Zurb Foundation，所以我想使用提供的类来执行此操作，而不要编写自己的媒体查询。这就是为什么我使用show-for-large。

但是，show-for-large被复制到如下所示的克隆菜单中：

<nav id="mm-header-bar-menu-wrapper" class="show-for-large mm-menu mm-menu_offcanvas mm-menu_opened">

如何防止CSS类被克隆？

或者，如何使用Foundation自己的断点来执行此操作？我不想在自己的CSS中写任何像素大小。

我也想避免不得不通过JavaScript添加/删除类，尽管我现在被迫这样做。

Answer 1

您可以尝试

$("#header-bar-menu-wrapper").clone().removeClass('show-for-large').mmenu({
    // options
}, {
    // configuration
})

通过启用克隆功能来阻止mmenu来克隆CSS类

1 个答案: