jQueryのmmenuで、ナビの中に戻るボタンを設置したい

###前提・実現したいこと

jQueryのmmenuについての質問です。
http://mmenu.frebsite.nl/

スマホサイトでmmenuを使ってナビゲーションを実装しています。
問題なく動作するのですが、開いたナビの中（下記の場合、#category配下）に
戻る（ナビを閉じる）ボタンを実装したいのですが、
どのように記述したらいいでしょうか。

jQueryの知識が乏しく、お助けいただけると嬉しいです。
よろしくお願い致します。

###該当のソースコード

<head>
    ~
    <link rel="stylesheet" href="css/jquery.mmenu.css">
    <link rel="stylesheet" href="css/jquery.mmenu.positioning.css">
    ~
</head>

<body>
    <div id="wrap">
        <header>
            <a href="#category">
                カテゴリー
            </a>
        </header>

        <nav id="category">
            <div>
                <ul>
                    <li>1</li>
                    <li>2</li>
                </ul>
            </div>
        </nav>
    </div>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script src="js/jquery.mmenu.min.js"></script>
    <script>
        $(function() {
            $("#category").mmenu({
                offCanvas: {
                    zposition: "front" 
                }
            });
        });
    </script>
</body>

以下のサイトの「ツールチップ風にする」の内容を参考に、
下記記述も試してみたのですが、うまく動きませんでした。

スマホアプリみたいなスライドメニューを実装できるmmenuを使ってみた
http://gimmicklog.main.jp/jquery/190/

<nav id="category">
    <div>
        <a href="#" class="close">×</a>
    </div>
</nav>

<script>
    $(function() {
        $('a.close').click(function() {
            $(this).closest('.mm-menu').trigger('close');
        });
    });
</script>

質問が不慣れで申し訳ございませんが、不明確な点等ありましたらお伝えください。
どうぞよろしくお願い致します。

kei344

2017/03/08 23:41

参考にされているサイトではJavaScriptで制御していますが、それは試されたのでしょうか。

shon

2017/03/11 11:39

確認が遅くなりすみません。参考サイトの内容を見逃しており、失礼致しました。ご回答くださりありがとうございました！

行動規範の内容に同意します

回答1件

ベストアンサー

javascript
1   $(document).ready(function() {
2      $("#my-menu").mmenu({
3         // Options
4      });
5      var API = $("#my-menu").data( "mmenu" );
6
7      $("#my-button").click(function() {
8         API.close();
9      });
10   });

HTML
1<a href="#my-page">Close the menu</a>

By default, the menu only closes after clicking on the still visible part of the page. The plugin also automatically binds a click event that closes the menu to every A element that links to the page.

jQuery.mmenu basic tutorial, open and close a menu

とのことなので、ダミーのアンカーリンクを設定すればいいかと思います。

投稿2017/03/09 01:32

編集2017/03/09 01:34