makcim_tol,
Открывашка 246 открыть закрыть по ссылке по крестику и вне блока
 
<!DOCTYPE html>
<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  .menu, .back{
    display: none;
  }
  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script>
$(function() {
    var div = $(".menu"),
        a = $(".mobile-menu"),
        b = $(".back");
    $(document).on("click", function(event) {
        var el = $(event.target);
        if (el.closest(div).length) return;
        if (el.closest(".mobile-menu").length) {
            event.preventDefault();
            var i = a.index(el.closest(".mobile-menu"));
            b.toggle(div.eq(i).is(":hidden"));
            div.not(div.eq(i).toggle()).hide()
        } else {
            div.hide();
            b.hide()
        }
    })
});
  </script>
</head>
<body>
<div class="back">back</div>
<a id="touch-menu" class="mobile-menu" href="#"><i class="icon-paragraph-left">left</i></a>
<nav class="menu">
<ul>
<li>left</li>
<li>left</li>
</ul>
</nav>
<a id="touch-menu-dom" class="mobile-menu" href="#"><i class="icon-paragraph-right">right</i></a>
<nav class="menu">
<ul>
<li>right</li>
<li>right</li>
</ul>
</nav>
</body>
</html>