Collapse Menu with Anchor links

  • Hi there,

    Working on this site:

    https://tigersfilms.wpengine.com/

    Wanted to use the responsive (hamburger) menu for all device sizes and it works beautifully for except for one thing — because I used anchor links on the homepage, it remains open after you’ve hit an anchor. I’d like to be able to continue to use the anchor links in the menu but have the menu close after clicking the anchor link in the menu. Any way to do that?

    Thanks in advance!

Viewing 5 replies - 1 through 5 (of 5 total)

  • You could try this jQuery code to see if it works.

    $('#menu li').on('click', function(){
        $("#menu").hide();
        $("#menu-icon").removeClass("active");
    });
    Thread Starter amandaj333

    (@amandaj333)

    A GIANT thanks to you!

    That definitely helped a whole lot! I changed your code slightly to:

    $(‘.responsive-menu li’).on(‘click’, function(){
    $(“.responsive-menu”).hide();
    $(“.responsive-menu”).removeClass(“active”);
    });

    One question tho — there’s a submenu in there, under directors. The problem now is that clicking ANYWHERE will close the menu. So if you click the little toggle to open the submenu, the whole thing closes. I would be great if you could open the sub, or if not, just have the sub always open. Thanks again for your help!

    Doing some looking around I can’t seem to find a solution to be able to open and close the submenu. Although, I think I found a CSS code that will always keep the submenus open.

    ul.sub-menu {
visibility: visible !important;
opacity: 1 !important;
}
    Thread Starter amandaj333

    (@amandaj333)

    On second thought there are a few problems with the way I’ve put this menu together so I’m gonna go with a plugin:

    https://www.ads-software.com/plugins/responsive-menu/

    Seems like it could be a decent solve here. Thanks for your help!

    No problem

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Collapse Menu with Anchor links’ is closed to new replies.