2

I'm using an Accordion menu instead of an Off-canvas solution below the medium breakpoint, as described in the Foundation Docs here, but I'm struggling to have the menu auto-closed after a link within the menu is clicked. I searched for a solution and have seen this question around but did not find an answer that worked for me. But i came across this example, and upon examination i thought simply substituting .off-canvas with the class used by the vertical menu would do the trick, but that's not the case.

$(document).foundation();    
    $('.vertical a').on('click', function() {
        $('.vertical').foundation('close');
    });

My menu markup:

<nav class="vertical menu" id="mobile-menu" role="navigation">
    <ul id="menu-main-1" class="vertical menu" data-accordion-menu="8k34n8-accordion-menu" role="tablist" aria-multiselectable="true">
        <li class="menu-item" role="menuitem"><a>Link 1</a></li>
        <li class="menu-item" role="menuitem"><a>Link 2</a></li>
        <li class="menu-item" role="menuitem"><a>Link 3</a></li>
    </ul>
</nav>

I'm new to this so please excuse if the answer is obvious. I hope for someone to point me in the right direction here so i learn something.

Community
  • 1
  • 1
Josh
  • 21
  • 2
  • I think your question may be ambiguous. Maybe you could describe what a closed Accordion menu looks like/how does it close? (fade out of site forever? slide somewhere? How do you see it again if it does close?). The code sample you provide is for a menu that never disappears no matter the size of the screen. Could include more of your actual code, or create a fiddle or codepen with more of your code. – Chris O Nov 14 '16 at 22:22

0 Answers0