README

此仓库只是将原始的js-library（包括css）集成到Magento 2中。

这是mmenu.js插件创建具有精确外观和感觉的离画布移动菜单的（极轻量级）替代方案。

有关"mmenu light"的更多信息，请查看以下链接

• 仓库
• 演示 & 文档
• 许可证：CC-BY-4.0
  • 我们没有更改"mmenu light"中的两个重用文件。
  • 作者：Fred Heusschen info@frebsite.nl

安装

cd <magento_root>
composer require mediarox/module-js-mmenu-light
bin/magento setup:upgrade

topMenu的设想示例

?>
<script>
    let navigationSelector = 'nav.navigation';
    let navigationToggleSelector = '[data-action="toggle-nav"]';
    let navigationActiveUlSelector = 'li.active > ul.submenu';
    let navigationMobileMediaQuery = '(max-width: 767px)';

    require([
        'mmenuLight'
    ], function ($) {
    
        // validate required elements
        const navigation = document.querySelector(navigationSelector);
        const navigationToggle = document.querySelector(navigationToggleSelector);
        if(!navigation || !navigationToggle) return;
        
        // init mmmenu
        const mobileMenu = new MmenuLight(navigation, navigationMobileMediaQuery);
        const mobileMenuNavigator = mobileMenu.navigation();
        const mobileMenuDrawer = mobileMenu.offcanvas();
        
        // set active panel if needed
        const activePanel = document.querySelector(navigationActiveUlSelector);
        if(activePanel) {
            mobileMenuNavigator.openPanel(activePanel);
        }
        
        // add click/open event
        navigationToggle.addEventListener("click", (event) => {
            event.preventDefault();
            mobileMenuDrawer.open();
        });
    });
</script>