Kazuto
Kazuto

Reputation: 158

Hide toggle menu after click

my Website https://www.meck.kazuto.de is almost finished. The only thing bothering me is the current toggle-menu. If you click a link, it stays open but I want it to be closed.

How can I do it?

<div id="mobil" class="mobil">
        <input type="checkbox" id="menu" name="menu" class="menu-checkbox">

        <div class="menu">

            <label class="menu-toggle" for="menu"><i class="fa fa-bars"></i>
            </label>

            <ul>
                  <label class="menu-hide" for="menu">&times;</label>
                  <li><a href="#wrapper" class="smoothScroll">Home</a>
                  </li>
                  <li><a href="#produkte" class="smoothScroll">Produkte</a>
                  </li>
                  <li><a href="#ueber" class="smoothScroll">Über Uns</a>
                  </li>
                  <li><a href="#so_gehts" class="smoothScroll">So geht's</a>
                  </li>
                  <li><a href="#anfahrt" class="smoothScroll">Anfahrt</a>
                  </li>
            </ul>

    </div>
</div>

Javascript should work fine on mobile devices, right? But I've never worked with javascript before xD

Upvotes: 0

Views: 1073

Answers (1)

Mazz
Mazz

Reputation: 1879

Since we don't have very much information you could use this for example. place it in your main js file.

$(".smoothScroll").on('click',function(){
    $(".menu-hide").trigger("click");
});

A better approach would be to add another class on your items and call the same function .menu-hide does.

Upvotes: 1

Related Questions