drawerのプラグインを行いたいです
HTML
1<body class="drawer drawer--left"> 2 <div class="div"> 3 <header role="banner"> 4 <div class="header"> 5 <div class="headerleft"> 6 <img src="img/logo.png" alt="logo"> 7 </div> 8 <div class="headerright"> 9 <button type="button" class="drawer-toggle drawer-humburger"> 10 <span class="sr-only">toggle navigation</span> 11 <span class="drawer-humburger-icon"></span> 12 </button> 13 <nav class="drawer-nav" role="navigation"> 14 <ul class="drawer-menu"> 15 <li><a href="#" class="drawer-brand">brand</a></li> 16 <li><a href="#card" class="drawer-menu-item">Card</a></li> 17 <li><a href="#news" class="drawer-menu-item">News</a></li> 18 <li><a href="#price" class="drawer-menu-item">Price</a></li> 19 <li><a href="#access" class="drawer-menu-item">Access</a></li> 20 <li><a href="#contact" class="drawer-menu-item">Contact</a></li> 21 </ul> 22 </nav> 23 </div> 24 </div> 25 </header> 26 <main role="main"> 27
HTML
1 <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script> 2 <script src="js/script.js"></script> 3 <script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.min.js"></script> 4<script type="text/javascript" src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script> 5<script type="text/javascript" src="js/slick/slick.min.js"></script> 6<script type="text/javascript" src="js/drawer.js"></script>
ここまでは検証のコンソールにはエラーは出てません。
javascript
1$(function(){ 2 $('.read').css('color','red'); 3 $('.your-class').slick( { 4 }); 5 $('.drawer').drawer(); 6});
これを打つと
jquery-3.3.1.slim.min.js:2 jQuery.Deferred exception: IScroll is not defined ReferenceError: IScroll is not defined
at HTMLBodyElement.refresh (http://127.0.0.1:5500/js/drawer.js:80:26) at HTMLBodyElement.instantiateDrawer (http://127.0.0.1:5500/js/drawer.js:54:22) at Function.each (http://code.jquery.com/jquery-1.11.0.min.js:2:2969) at e.fn.init.each (http://code.jquery.com/jquery-1.11.0.min.js:2:845) at e.fn.init.init (http://127.0.0.1:5500/js/drawer.js:45:19) at e.fn.init.drawer (http://127.0.0.1:5500/js/drawer.js:167:22) at HTMLDocument.<anonymous> (http://127.0.0.1:5500/js/script.js:5:16) at l (https://code.jquery.com/jquery-3.3.1.slim.min.js:2:29567) at c (https://code.jquery.com/jquery-3.3.1.slim.min.js:2:29869) undefined
w.Deferred.exceptionHook @ jquery-3.3.1.slim.min.js:2
jquery-3.3.1.slim.min.js:2 Uncaught ReferenceError: IScroll is not defined
at HTMLBodyElement.refresh (drawer.js:80)
at HTMLBodyElement.instantiateDrawer (drawer.js:54)
at Function.each (jquery-1.11.0.min.js:2)
at e.fn.init.each (jquery-1.11.0.min.js:2)
at e.fn.init.init (drawer.js:45)
at e.fn.init.drawer (drawer.js:167)
at HTMLDocument.<anonymous> (script.js:5)
at l (jquery-3.3.1.slim.min.js:2)
at c (jquery-3.3.1.slim.min.js:2)
とエラーが出てきてしまいドロワーは実装されません。
エラー部分は何か確認すると js の$('.drawer').drawer();についてでした
ちなみに文字が赤いのはjsが実装されてるか確認するためのものです。
使い方ページを見てもなぜできないのかわかりませんので教えてください
プラグインファイルは
プロジェクトファイル>index.html
img
css
js>(スライダーのプラグイン).js
drawer.js
となっています。
エラーの理由と改善方法を知りたいです。
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。