jquery.coverscroll:複数画像を横一列に少し重ねてスライドし、真ん中画像のみ強調表示するJs
- 2019.06.22
- JavaScript jQuery
- jquery.coverscroll, 画像スライダー

選択した画像が真ん中に移動し、強調されます。また複数画像は左右にスライドします。
1.ヘッダーとJavaScriptの記述例
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script> <script type="text/javascript" src="jquery.coverscroll.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $('#idCs').coverscroll(); }); </script>
2.CSSの記述例
<style type="text/css"> <!-- #idCs{ width:1000px; height:280px; } --> </style>
3.HTMLの記述例
<div id="idCs"> <img src="i1.jpg" alt=""> <img src="i2.jpg" alt=""> <img src="i3.jpg" alt=""> <img src="i4.jpg" alt=""> <img src="i5.jpg" alt=""> <img src="i6.jpg" alt=""> <img src="i7.jpg" alt=""> <img src="i8.jpg" alt=""> <img src="i9.jpg" alt=""> <img src="i10.jpg" alt=""> </div>
-
前の記事
jquery.imagecube:複数画像をサイコロの様に回転表示するJs 2019.06.21
-
次の記事
jquery.tooltipster.js:リンクにフキダシ(ツールチップ)を表示してくれるJs 2019.06.23