困っていること
swiper.jsを設定したのです、全く動かなくて困っています。
swiper.jsのサイトからv4.0.7をダウンロードして使っています。
記述は下記です。
html
1<!DOCTYPE HTML> 2<html> 3<head> 4<link href="/common/css/swiper.min.css" rel="stylesheet" type="text/css" /> 5<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script> 6<script src="/common/js/swiper.min.js"></script> 7 8<script> 9var swiper = new Swiper('.swiper-container', { 10 direction: 'vertical', 11 speed: 600, 12 autoplay:200, 13 loop: true, 14}); 15</script> 16</head> 17 18<body> 19<div class="slide"> 20<div class="swiper-container"> 21 <ul class="swiper-wrapper"> 22 <li class="swiper-slide"><img src="common/images/slide_01.jpg" alt=""></li> 23 <li class="swiper-slide"><img src="common/images/slide_02.jpg" alt=""></li> 24 <li class="swiper-slide"><img src="common/images/slide_03.jpg" alt=""></li> 25 </ul> 26</div> 27</div> 28</body>
css
1.slide ul.swiper-wrapper{ 2 width:100%; 3 height: 550px; 4} 5.slide ul.swiper-wrapper li.swiper-slide{ 6 width:100%; 7 height: 100%; 8}
どこを直したら動くようになるのでしょうか?
どなたかご教授お願い致します。
追記
Tomak様に回答いただき修正してみましたので、追記いたします。
※loop: true,のカンマを削除
※コンソールで確認したところ、以下のエラーが出てました。
→ 'a[href^="#"]'に書き換えたところエラー表示は無くなりましたが、動きません。
※mac使用で確認したブラウザは下記の3つです。
・chrome バージョン: 63.0.3239.84
・safari バージョン10.0 (12602.1.50.0.10)
・firefox 最新バージョン
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2017/12/28 08:10