No Comments

toggle mobile menu programmatically

How to make the state/region optional in Magento 2.0.7?
Does Magento 1.9 allow basic authorization in REST API?

I would like to collapse themes mobile menu programmatically. How would I do this in my custom theme. I see the default navigation-menu.js which has a method this._toggleMobileMode();. In my custom js I would like to call this function how would I do this?

I try to extend the widget as follows but without any result

define([
    "jquery",
    "slider",
    "mage/menu"
], function($) {
    "use strict";
    $.widget('bsw.menu', $.mage.menu,  {
        _init: function () {
            $window.on('resize', this._checkWidth);
            this._checkWidth();
        },

        _checkWidth: function () {
            var nav = $('nav.navigation').children('ul').find('li');
            var menuWidth = 0;
            nav.each(function (idx, li) {
                var item = $(li);
                menuWidth += item.outerWidth();
            });

            if (menuWidth > $(window).width() ) {
                this._toggleMobileMode();
            }
        }

    });

    return $.bsw.menu;

});

Related Posts

  • Magento 2 jquery menu/nav widgets (0)
    I'm trying to utilize the menu or nav jQuery widget that comes with Magento 2 based on what I'm trying to accomplish. A secondary navigation section that will live on a sidebar element. It's just a vertical nav, nothing fancy - no ajax or actual calls for data. Just a list of links […]
  • Magento 2 jquery menu/nav widgets (0)
    I'm trying to utilize the menu or nav jQuery widget that comes with Magento 2 based on what I'm trying to accomplish. A secondary navigation section that will live on a sidebar element. It's just a vertical nav, nothing fancy - no ajax or actual calls for data. Just a list of links […]
  • Collapse Blank mobile menu with Javascript (0)
    How would I activate with javascript the mobile menu. My theme inherits from blank. Right now the menu do not collapse if is out of viewport so I would like to activate with jquery
  • How to disable auto collapse in mobile menu? (0)
    In mobile menu of Magento 2 when we click any child item of a parent, the parent collapse [see the image] what can i do to disable this behaviour. Demo: http://magento2-demo.nexcess.net/contact
  • How to disable auto collapse in mobile menu? (0)
    In mobile menu of Magento 2 when we click any child item of a parent, the parent collapse [see the image] what can i do to disable this behaviour. Demo: http://magento2-demo.nexcess.net/contact
  • ReferenceError: next is not defined in magento (0)
    I have added multiple versions of jquery library like as 1.11.3 and 1.7.2, both are minified files. and i added jquery no-conflict. I want swipe image in mobile version, so added bootslider js file, that file given an error this "ReferenceError: next is not defined […]
  • How to dispaly categories in swipe menu for mobile device? (0)
    i am working on mobile device magento website and new to magento . I want to display all categories in mobile devise swipe menu, as attached in image i aleady have swip menu need to add cateories on it and it should be toggle . can any one help on this?
  • How to load custom JS and dependencies using RequireJS (1)
    I'm struggling to understand where and how to correctly configure RequireJS to load my custom JS and it's dependencies. What I have below is working but I don't think it's set up correctly. My theme requirejs-config.js var config = { paths: { 'myapp': '"js/myapp"', […]
  • Adding Currency Switcher to Nav Menu [closed] (1)
    Been searching around here but can't seem to find an answer to this. How do I add currency switcher in navigation menu in mobile view? It's displaying on the header in desktop view. Would like to add into navigation menu in mobile view. Regards, Chris
  • jquery not defined error in magento 2 (1)
    I am trying to bring banner scroll in magento2. I am using owl carousel for this purpose. Everything have done and implemented and is showing in firefox without any errors. But when checked in chrome, i found jquery not defined error. After some diggings, i found we need to use call […]
How to make the state/region optional in Magento 2.0.7?
Does Magento 1.9 allow basic authorization in REST API?

Be the first to post a comment.

Add a comment

To create code blocks or other preformatted text, indent by four spaces:

    This will be displayed in a monospaced font. The first four 
    spaces will be stripped off, but all other whitespace
    will be preserved.
    
    Markdown is turned off in code blocks:
     [This is not a link](http://example.com)

To create not a block, but an inline code span, use backticks:

Here is some inline `code`.

For more help see http://daringfireball.net/projects/markdown/syntax