現在スマホサイトを設計しており、ドロワーにどのプラグインを使用しようか迷っております。
http://git.blivesta.com/drawer/
こちらのサイトのものが動きも見た目もかっこよくて使いたかったのですが、
少し煩雑なコードになるとドロワーがスクロール出来なくなるという問題に直面しております。
http://on-ze.com/demo/jquery-drawer/
こちらのサイトのように通常であればドロワー内でスクロールが可能です。
html
1<body class="drawer drawer--left"> 2 <header role="banner"> 3 <button type="button" class="drawer-toggle drawer-hamburger"> 4 <span class="sr-only">toggle navigation</span> 5 <span class="drawer-hamburger-icon"></span> 6 </button> 7 <nav class="drawer-nav" role="navigation"> 8 <ul class="drawer-menu"> 9 <li><a class="drawer-brand" href="#">Brand</a></li> 10 <li><a class="drawer-menu-item" href="#">Nav1</a></li> 11 <li><a class="drawer-menu-item" href="#">Nav2</a></li> 12 </ul> 13 </nav> 14 </header> 15 <main role="main"> 16 <!-- コンテンツ --> 17 </main> 18</body>
しかし、
『<div class="content">Hello</div>』を追加
html
1<body class="drawer drawer--left"> 2 <header role="banner"> 3 <button type="button" class="drawer-toggle drawer-hamburger"> 4 <span class="sr-only">toggle navigation</span> 5 <span class="drawer-hamburger-icon"></span> 6 </button> 7 <nav class="drawer-nav" role="navigation"> 8 <ul class="drawer-menu"> 9 <li><a class="drawer-brand" href="#">Brand</a></li> 10 <li><a class="drawer-menu-item" href="#">Nav1</a></li> 11 <li><a class="drawer-menu-item" href="#">Nav2</a></li> 12 </ul> 13 <div class="content">Hello</div> 14 </nav> 15 </header> 16 <main role="main"> 17 <!-- コンテンツ --> 18 </main> 19</body>
このようにdivをひとつ追加するとドロワー内スクロールが出来なくなってしまいます。
このプラグインをご存知の方で何か良い対処方法はありますでしょうか?
もしくは、少しリッチなドロワーを作れるようなプラグインなどがあれば教えていただけると助かります。
よろしくお願い致します。
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2016/06/06 16:28
2016/06/06 16:38 編集
2016/06/06 17:16