javascript - jquery mega 下拉菜单插件（dcMegaMenu）如何更改事件悬停以单击窗口调整大小

Question

jquery mega 下拉菜单插件：（http://www.designchemical.com/lab/jquery-mega-drop-down-menu-plugin/advanced-styling/）

嗨，伙计们，我正在使用http://www.designchemical.com的 jquery mega 下拉菜单插件开发一个响应式网站。

在桌面上，默认情况下全宽窗口（980 像素以上宽度）我在插件选项中使用事件：“悬停”。但是我需要一个关于如何更改事件的解决方案：当窗口大小低于 980px 宽度时“单击”？

希望能在这里找到解决办法。非常感谢！

Answer 1

试试这行：

jQuery(document).ready(function($) {
   if($(window).width() < 980){
      jQuery('#mega-menu').dcMegaMenu({
         event: 'click'
    });
   }
 });

或在窗口调整大小：

    jQuery(window).resize(function($) {
      if($(window).width() < 980){
        jQuery('#mega-menu').dcMegaMenu({
           event: 'click'
        });
       }
    });

祝你好运！

Answer 2

$('#mega-menu-1').dcMegaMenu({
            rowItems: '3',
            speed: 600,
            effect: 'slide',
            event: 'click'
        });

事件：'click' 仅适用于水平巨型菜单。垂直巨型菜单中没有单击选项。

Answer 3

1）创建一个函数来初始化megamenu，取决于宽度（对于这种情况，如果宽度大于966px，则会启动megamenu）

function init_megamenu() {
    var w = $(window).width();
    if (w >= 966) {
        $('#mega-menu-9').dcMegaMenu({
            rowItems: '3',
            speed: 'fast',
            effect: 'fade'
        });
    }
}

2) 在文档准备好和窗口调整大小时调用 init_megamenu() 函数

$(document).ready(function() {
    // desktop menu
    init_megamenu();
});

$(window).resize(function() {
    // desktop menu
    init_megamenu();
});