Open govind2988 opened 8 years ago
Hello @govind2988 ! This is the feature that will be in the next version of this script. This version is NOT supporting opening submenus as accordions out of the box and you could very easily make it work :) In the meantime please wait for new version(soon). Thanks for using megamenu.js!
Ok thank you Mario Loncarek.
I think this is what he was asking for.
$(".menu > ul > li").click(function () { if ($(window).width() <= 943) { $(this).children("ul").fadeToggle(150); $(this).siblings("li").find("ul:first").hide(); } });
Thanks for your contribution!!
Hello, just to let you know, your request is in development with v2
Hi, any idea when v2 will be available???
You can already use it, just chose v2 in branch dropdown on github. Only thing is there are no animations.
Here's how I got the +/- thing working on the mobile submenus. Note that I renamed the menu-dropdown-icon class to menu-open-icon, didn't use the image font, and claim no jQuery mastery.
CSS Changes
/ Screen Styles / .menu-open-icon:before, .menu-close-icon:before { display: none; cursor: pointer; float: right; font-size: 3em; background: #8f2615; color: #fff; } .menu-open-icon:before { content: "+"; padding: .5em; } .menu-close-icon:before { content: "-"; padding: .45em .5em .55em; }
/ Mobile Styles / .menu-open-icon:before, .menu-close-icon:before { display: block; }
JavaScript Changes (aside from changing 'dropdown' to 'open' near the top to match my CSS change)
$(".menu > ul > li").click(function() { if ($(window).width() <= 959) { / Shows or hides the submenu / $(this).children("ul").fadeToggle(150); } if ($(this).hasClass("menu-open-icon")) { / Swap + with - when the submenu is opened / $(this).removeClass('menu-open-icon'); $(this).addClass('menu-close-icon'); } else { / Swap - with + when the submenu is closed / $(this).removeClass('menu-close-icon'); $(this).addClass('menu-open-icon'); } });
Any chance you can just make a new complete css and js version?
On Wed, Aug 2, 2017 at 1:47 AM, Michael Mitchell notifications@github.com wrote:
Here's how I got the +/- thing working on the mobile submenus. Note that I renamed the menu-dropdown-icon class to menu-open-icon, didn't use the image font, and claim no jQuery mastery.
CSS Changes
/ Screen Styles / .menu-open-icon:before, .menu-close-icon:before { display: none; cursor: pointer; float: right; font-size: 3em; background: #8f2615; color: #fff; } .menu-open-icon:before { content: "+"; padding: .5em; } .menu-close-icon:before { content: "-"; padding: .45em .5em .55em; }
/ Mobile Styles / .menu-open-icon:before, .menu-close-icon:before { display: block; }
JavaScript Changes (aside from changing 'dropdown' to 'open' near the top to match my CSS change)
$(".menu > ul > li").click(function() { if ($(window).width() <= 959) { /* Shows or hides the submenu
/ $(this).children("ul").fadeToggle(150); } if ($(this).hasClass("menu-open-icon")) { / Swap + with - when the submenu is opened
/ $(this).removeClass('menu-open-icon'); $(this).addClass('menu-close-icon'); } else { / Swap - with + when the submenu is closed */ $(this).removeClass('menu-close-icon'); $(this).addClass('menu-open-icon'); } });
— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/marioloncarek/megamenu-js/issues/3#issuecomment-319574031, or mute the thread https://github.com/notifications/unsubscribe-auth/AXc__5IZb3DL2eXqkGWGw4Yki_whI6dEks5sUA11gaJpZM4IklWC .
Hi, How to close other opened ul's when i clicking "+". Also need to changes + to - when displaying submenu.