我知道这可能很远。我正在使用Adobe Accessible Mega Menu。它具有可以在鼠标悬停时打开菜单或单击的设置。
https://github.com/adobe-accessibility/Accessible-Mega-Menu https://github.com/adobe-accessibility/Accessible-Mega-Menu/blob/master/js/jquery-accessibleMegaMenu.js
我想做的是,将鼠标悬停在> 1024上打开菜单,然后单击<1024打开单击。
我几乎可以正常工作,但是在调整大小时却无法正常工作。
这就是我添加的内容:
(function ($, window, document) {
"use strict";
var $window = $(window);
var NotMobile;
function checkWidth() {
var windowsize = $window.width();
if (windowsize > 1024) {
//if the window is greater than 1024px
NotMobile = true;
//alert(windowsize);
//alert(NotMobile);
}
else {
NotMobile = false;
//alert(windowsize);
//alert(NotMobile);
}
}
// Execute on load
checkWidth();
// Bind event listener
$(window).resize(function() {
if(this.resizeTO) clearTimeout(this.resizeTO);
this.resizeTO = setTimeout(function() {
$(this).trigger('resizeEnd');
}, 500);
});
$(window).bind('resizeEnd', function() {
checkWidth();
});
var pluginName = "accessibleMegaMenu",
defaults = {
uuidPrefix: "accessible-megamenu", // unique ID's are required to indicate aria-owns, aria-controls and aria-labelledby
menuClass: "accessible-megamenu", // default css class used to define the megamenu styling
topNavItemClass: "accessible-megamenu-top-nav-item", // default css class for a top-level navigation item in the megamenu
panelClass: "accessible-megamenu-panel", // default css class for a megamenu panel
panelGroupClass: "accessible-megamenu-panel-group", // default css class for a group of items within a megamenu panel
hoverClass: "hover", // default css class for the hover state
focusClass: "focus", // default css class for the focus state
openClass: "open", // default css class for the open state,
toggleButtonClass: "accessible-megamenu-toggle", // default css class responsive toggle button
openDelay: 0, // default open delay when opening menu via mouseover
closeDelay: 250, // default open delay when opening menu via mouseover
openOnMouseover: NotMobile
},
我认为out功能不起作用的原因并未设置为在调整大小时再次执行,因此我可以更改变量,但不会更改设置。