jquery.sidr.min.js
こいつを使う
※追記
class=”simple-menu” href=”#sidr”
とし
出てくるのにも
class=”simple-menu” href=”#sidr”要素を入れて
閉じる
下記だと IDだから1こしかきかない
http://number333.org/2013/06/14/sidr/
説明
ヘッダー
<link href="/js/css/jquery.sidr.dark.css" rel="stylesheet" type="text/css"> <script src="/js/jquery.sidr.min.js"></script> <script> $(document).ready(function() { $('.simple-menu').sidr({side: 'right'}); }); </script>
こいつでくくって
<?php if (is_mobile()) : //モバイルヘッダー ?> <?php endif; ?>
リンクボタン
<a class="simple-menu" href="#sidr"> <img src="/img/d_this/moble_menu.jpg" width="120" height="120" alt="モバイルメニュー" /> </a>
実際のコード
<div id="sidr"> <!-- Your content --> <ul> <li><a href="/会社概要/">タマツアーバリとは</a></li> <li style="text-align:center">現地ツアー</li> <?php wp_list_categories('title_li=&depth=1&taxonomy=bali-tours-cat&hide_empty=0'); ?> <li style="text-align:center">オプショナルツアー</li> <?php wp_list_categories('title_li=&depth=1&taxonomy=bali-optional-tours-cat&hide_empty=0'); ?> <li style="text-align:center"> </li> <li><a href="/bali-tours/世界遺産ボロブドゥールへバリから日帰ツアー/"> 世界遺産ボロブドゥール</a> </a></li> <li> <li> <a href="/bali-tours/バリ島空港送迎(デンパサール国際空港)/"> 空港送迎 </a> </li> <li> <a href="/bali-tours/ガソリン代込のお得な車チャーター!行動自由で/"> 車チャーター </a> </li> <li style="text-align:center"> </li> <li> <a href="/bali-tours-voice/"> お客様の声 </a> </li> <li style="text-align:center"> </li> <li><a href="/お問合せ/">お問合せ</a></li> <li><a href="/会社概要/">会社概要</a></li> <li><a href="/個人情報の取扱/">個人情報の取扱</a></li> </ul> </div> <script> $(document).ready(function() { $('#simple-menu').sidr({side: 'right'}); }); </script>