Close Menu with Slidetoggle

Asked

Viewed 260 times

2

Hello guys I’m with a menu for mobile "burger" and I’m wanting it to close when I click on some link from the menu.

HTML code from menu:

<div class="menu">
    <button class="hamburger">
        <img src="images/responsive/cel_retrato/ham.png"/>
    </button>
    <button class="cross">&#735;</button>
    <ul clas="menuMM">
        <a href="#topo"><li>HOME</li></a>
        <a href="#pixel"><li>SOBRE</li></a>
        <a href="#servicos"><li>SERVIÇOS</li></a>
        <a href="#projetos"><li>PORTFÓLIO</li></a>
        <a href="#contactM"><li>CONTATO</li></a>
    </ul>
</div>

Javascript code:

$( ".cross" ).hide();
$( ".menu" ).hide();
$( ".hamburger" ).click(function() {
    $( ".menu" ).slideToggle( "slow", function() {
        $( ".hamburger" ).hide();
        $( ".cross" ).show();
    });
});
$( ".cross" ).click(function() {
    $( ".menu" ).slideToggle( "slow", function() {
        $( ".cross" ).hide();
        $( ".hamburger" ).show();
    });
});

To close the menu I’m ultilizando this logic, but it’s not working.

$( ".menuMM" ).click(function() {
    $( ".menu" ).slideToggle( "slow", function() {
        $( ".cross" ).hide();
        $( ".hamburger" ).show();
    });
});
  • Dear, in your logic, by clicking on .menuMM he executes the slideToggle(); in the .menu where it contains .cross and .hamburguer, following this, should hide all elements within .menu. What appears not to be working ?

  • When I click on some menu it is not hiding the MENU.

  • Your intention is when you click on .menu hide the .menuMM even?

1 answer

1


Correct the attribute clas="menuMM" for class="menuMM", this is probably causing the error. I did an example on jsfiddle and worked perfectly.

  • our neither saw, thanks friend rs

Browser other questions tagged

You are not signed in. Login or sign up in order to post.