【sidr】メニュー外をクリックしたらサイドメニューを閉じる。

jQuery のsidr便利。サイドメニューをささっとつくるのに最適です。
ですが、sidrだけだとサイドメニューが出た後閉じるのに同じボタンを押さないといけないとかいろいろ不便ですよね。
なので、サイドメニューにCloseボタンをつけるのが一般的ですが、Close押すのもめんどくさい
メイン画面触ったらサイドメニューが閉じるようにしてみました。

            <div class="collapse navbar-collapse">
                <ul class="nav navbar-nav">
                    <li><a href="#sidr" class="btn sidr-menu"><span class="glyphicon glyphicon-home"></span></a></li>
                    <li><a href="#/">一覧</a></li>
                    <li><a href="#/new">登録</a></li>
                </ul>
            </div>
            <div id="sidr">
                <a  class="pull-right sidr-menu" href="#sidr"><span class="glyphicon glyphicon-remove-circle"></span>Close</a>
                <ul class="nav">
                    <li class="btn"><a href="#/"><span class="glyphicon glyphicon-home"></span></a></li>
                </ul>
                <div class="panel panel-success">
                    <div class="panel-heading">
                        <a data-toggle="collapse" data-parent="#accordion" href="#submenu">管理</a>
                    </div>
                    <div id="submenu" class="panel-collapse collapse">
                        <a class="list-group-item" href="#/">一覧</a>
                        <a class="list-group-item" href="#/new">登録</a>
                    </div>
                </div>
            </div>

        <script>
            jQuery(document).ready(function () {
                jQuery('.sidr-menu').sidr();
            });
            jQuery('div#contents').click(function () {
                jQuery.sidr('close','sidr');
            });
        </script>

こんな感じで便利になった。
サンプルとか見ていてもコンテンツクリックしたときに閉じるのはあまりでてなくてみんな実装しないのかしら・・・？