diff --git a/README.md b/README.md index c229126..048767d 100644 --- a/README.md +++ b/README.md @@ -55,6 +55,7 @@ navDropdownToggleClassName: "nav__dropdown-toggle", // class used for the dropdo navDropdownLabel: "more", // Text that is used for the dropdown toggle. navDropdownBreakpointLabel: "menu", //button label for navDropdownToggle when the breakPoint is reached. breakPoint: 500, //amount of pixels when all menu items should be moved to dropdown to simulate a mobile menu +turnOffPoint: 0, //amount of pixels when plugin should be disabled (all menu items should be outside the dropdown) throttleDelay: 50, // this will throttle the calculating logic on resize because i'm a responsible dev. offsetPixels: 0, // increase to decrease the time it takes to move an item. count: true, // prints the amount of items are moved to the attribute data-count to style with css counter. diff --git a/src/priority-nav.js b/src/priority-nav.js index 86df0bd..7b4fbe5 100644 --- a/src/priority-nav.js +++ b/src/priority-nav.js @@ -38,7 +38,7 @@ throttleDelay: 50, // this will throttle the calculating logic on resize because i'm a responsible dev. offsetPixels: 0, // increase to decrease the time it takes to move an item. count: true, // prints the amount of items are moved to the attribute data-count to style with css counter. - + turnOffPoint: 500, //amount of pixels when plugin should be disabled (all menu items should be outside dropdown) //Callbacks moved: function () { }, @@ -305,25 +305,30 @@ /** * Keep executing until all menu items that are overflowing are moved */ - while (totalWidth <= restWidth && _this.querySelector(mainNav).children.length > 0 || viewportWidth < settings.breakPoint && _this.querySelector(mainNav).children.length > 0) { - //move item to dropdown - priorityNav.toDropdown(_this, identifier); - //recalculate widths - calculateWidths(_this, identifier); - //update dropdownToggle label - if(viewportWidth < settings.breakPoint) updateLabel(_this, identifier, settings.navDropdownBreakpointLabel); - } + if(viewportWidth > settings.turnOffPoint) { + while (totalWidth <= restWidth && _this.querySelector(mainNav).children.length > 0 || viewportWidth < settings.breakPoint && _this.querySelector(mainNav).children.length > 0) { + //move item to dropdown + priorityNav.toDropdown(_this, identifier); + //recalculate widths + calculateWidths(_this, identifier); + //update dropdownToggle label + if(viewportWidth < settings.breakPoint) updateLabel(_this, identifier, settings.navDropdownBreakpointLabel); + } - /** - * Keep executing until all menu items that are able to move back are moved - */ - while (totalWidth >= breaks[identifier][breaks[identifier].length - 1] && viewportWidth > settings.breakPoint) { - //move item to menu - priorityNav.toMenu(_this, identifier); - //update dropdownToggle label - if(viewportWidth > settings.breakPoint) updateLabel(_this, identifier, settings.navDropdownLabel); + /** + * Keep executing until all menu items that are able to move back are moved + */ + while (totalWidth >= breaks[identifier][breaks[identifier].length - 1] && viewportWidth > settings.breakPoint) { + //move item to menu + priorityNav.toMenu(_this, identifier); + //update dropdownToggle label + if(viewportWidth > settings.breakPoint) updateLabel(_this, identifier, settings.navDropdownLabel); + } + } else { + while(breaks[identifier].length > 0) { + priorityNav.toMenu(_this, identifier); + } } - /** * If there are no items in dropdown hide dropdown */ @@ -523,7 +528,7 @@ * Remove when clicked outside dropdown */ document.addEventListener("click", function (event) { - if (!getClosest(event.target, "."+settings.navDropdownClassName) && event.target !== _this.querySelector(navDropdownToggle)) { + if (!getClosest(event.target, "."+settings.navDropdownClassName) && event.target !== _this.querySelector(navDropdownToggle) && event.target.parentNode !== _this.querySelector(navDropdownToggle)) { _this.querySelector(navDropdown).classList.remove("show"); _this.querySelector(navDropdownToggle).classList.remove("is-open"); _this.classList.remove("is-open"); @@ -715,4 +720,4 @@ */ return priorityNav; -}); \ No newline at end of file +});