I have hamburger menu which works great, but I want to add some funtion, which will hide menu when user clicks OUTSIDE the whole hamburger menu.
$(".cross").hide();
$(".mobilemenu").hide();
$(".hamburger").click(function() {
$(".mobilemenu").slideToggle("slow", function() {
$(".hamburger").hide();
$(".cross").show();
});
});
$(".cross").click(function() {
$(".mobilemenu").slideToggle("slow", function() {
$(".cross").hide();
$(".hamburger").show();
});
});
$(".clickham").click(function() {
$(".mobilemenu").slideToggle("slow", function() {
$(".cross").hide();
$(".hamburger").show();
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<header>
<button class="hamburger">☰</button>
<button class="cross">˟</button>
</header>
<div class="mobilemenu">
<ul>
<a href="#" class="clickham">
<li>Test</li>
</a>
<a href="#" class="clickham">
<li>Test2</li>
</a>
</ul>
</div>