marioloncarek / megamenu-js

Last responsive megamenu you'll ever need
MIT License
360 stars 115 forks source link

how i change hover menu to click #8

Open webineh opened 8 years ago

webineh commented 8 years ago

hello

how i change hover menu to click in megamenu ??

marioloncarek commented 8 years ago

You want the dropdowns to be opened on click and not on hover? Like on mobile?

webineh commented 8 years ago

no , i need to after click a menu then open megamenu , in default when hover mouse then it open

marioloncarek commented 8 years ago

sorry but I dont really know what are you trying to ask me, please explain me again

webineh commented 8 years ago

i need to click menu in windows not in mobile ! in large size then instance hover mouse open submenu click it then open sub menu .

webineh commented 8 years ago

excuse for bad english

marioloncarek commented 8 years ago

i have no idea what are you talking about, sorry, here is the version of the menu where you click to open menus on every width (large and mobile) : http://codepen.io/riogrande/pen/pbVjqm

What i did i simply renamed .hover to .click on line 19.

Did this fixed your problems?

webineh commented 8 years ago

ok it work , but have a bug, after click to outside menu not close.

marioloncarek commented 8 years ago

its not a bug when this is not a feature :) why dont you try to fix this, its not really that hard, 90% its allready fixed on stack overflow :)

marioloncarek commented 8 years ago

http://stackoverflow.com/questions/1403615/use-jquery-to-hide-a-div-when-the-user-clicks-outside-of-it

http://stackoverflow.com/questions/152975/how-to-detect-a-click-outside-an-element

I googled " click outside jquery "

webineh commented 8 years ago

ok

$(window).click(function() {
//Hide the menus if visible
});

$('#menucontainer').click(function(event){
    event.stopPropagation();
});


        $(".menu > ul > li").click(function (e) {

                e.stopPropagation();  // for stop click outside the menu

        if ($(window).width() > 943) {
            $(this).children("ul").stop(true, false).fadeToggle(0);
            e.preventDefault();
        }
    });

when click to windows

$(window).click(function() { $(this).children("ul").fadeToggle(150); });

not close

wsst2008 commented 8 years ago

If understood correctly:

//If width is more than 943px dropdowns are displayed on hover

$(".menu > ul > li").click(function () {
    if ($(window).width() <= 2000) {
        $(this).children("ul").fadeToggle(0);
    }

}); jQuery(function($){ $(document).mouseup(function (e){ if ($(window).width() > 1100) var div = $(".menu > ul > li > ul"); if (!div.is(e.target) && div.has(e.target).length === 0) { div.hide(); } }); });

mendy51 commented 3 years ago

http://codepen.io/riogrande/pen/pbVjqm

Hello, how do I make sure that when I click on another tab the other one closes automatically? It's becoming a real problem for me, it's been 2 weeks since I fight with it

mendy51 commented 3 years ago

Je sais nous somme en 2020 LOL

marioloncarek commented 3 years ago

one approach would be to add class on click, then write a logic which would firstly on click find an element with that class and close the dropdown, then you would add a class to new one and open it @mendy51