お世話になります。
タイトルの通りでOwl Carouselというプラグインでスライダー画像を設定しております。
https://owlcarousel2.github.io/OwlCarousel2/
1ページ内に複数のOwl Carouselを設置する場合、スタイルを変更したい場合があるかと思います。
1つはメインスライダーとして1枚だけ表示
1つはバナー用として4枚表示
この際に以下のようなコードで設定を変更出来ないかと思って模索したのですが出来ませんでした。
https://singapore.intercontinental.com/stay/rooms-suites/guestrooms
このサイトは1つのowl carouselで複数タイプのスライダーを実装しています。
ただ、ソースを見てもよくわからなくて、、、
お力貸していただけるとありがたいです。
Html
1<div class="owl-carousel" id="main-slider"> 2 <div><img src="images/sample.png" alt=""></div> 3 <div><img src="images/sample.png" alt=""></div> 4 <div><img src="images/sample.png" alt=""></div> 5</div> 6 7<div class="owl-carousel" id="banner-slider"> 8 <div><img src="images/sample.png" alt=""></div> 9 <div><img src="images/sample.png" alt=""></div> 10 <div><img src="images/sample.png" alt=""></div> 11</div> 12 <script type="text/javascript"> 13 $(document).ready(function(){ 14 $(".owl-carousel").owlCarousel({ 15 autoplay: true, 16 center: true, 17 stagePadding: 115, 18 items:1, 19 nav: true, 20 loop:true 21 }); 22 }); 23</script>
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2018/03/13 01:12