Search code examples
javascripthtmlmobilemenuslicknav

SlickNav jQuery plugin - only one open menu


I would like to achieve an accordion effect with this plugin. By default it works as a toggle. I would need to collapse opened menus when I click on another level 1 menu.

My structure is:

  • level 1 anchor
  • level 1 anchor

    • level 2 anchor
      • level 3 anchor
      • level 3 anchor
      • level 3 anchor
    • level 2 anchor
  • level 1 anchor

  • level 1 anchor

I need to close all opened level 1 submenus when I click on another submenu. Could anyone help me with this please?

Thank you very much.

I'm using this plugin - https://raw.github.com/ComputerWolf/SlickNav/master/jquery.slicknav.js

http://slicknav.com/


Solution

  • this sems to work

    $('#menu').slicknav({
        'open': function(trigger){
            var that = trigger.parent().children('ul');
            $('.slicknav_menu ul li.slicknav_open ul').each(function(){
                if($(this).get( 0 ) != that.get( 0 )){
                    $(this).slideUp().addClass('slicknav_hidden');
                    $(this).parent().removeClass('slicknav_open').addClass('slicknav_collapsed');
                }
            })
        }, 
    });