「サムネイルスライドショー」ブロックについて

<!--▼▼▼▼▼ここから「サムネイルスライドショー」-->
<section class="padding-lr0">

<div class="slide-thumbnail1">
<div class="img rtl">
<div><a href="#"><img src="../images/thumb1.jpg" alt=""></a></div>
<div><a href="#"><img src="../images/thumb2.jpg" alt=""></a></div>
<div><a href="#"><img src="../images/thumb3.jpg" alt=""></a></div>
<div><a href="#"><img src="../images/thumb4.jpg" alt=""></a></div>
<div><a href="#"><img src="../images/thumb5.jpg" alt=""></a></div>
<div><a href="#"><img src="../images/thumb6.jpg" alt=""></a></div>
</div>
</div>

<div class="slide-thumbnail1">
<div class="img ltr">
<div><a href="#"><img src="../images/thumb1.jpg" alt=""></a></div>
<div><a href="#"><img src="../images/thumb2.jpg" alt=""></a></div>
<div><a href="#"><img src="../images/thumb3.jpg" alt=""></a></div>
<div><a href="#"><img src="../images/thumb4.jpg" alt=""></a></div>
<div><a href="#"><img src="../images/thumb5.jpg" alt=""></a></div>
<div><a href="#"><img src="../images/thumb6.jpg" alt=""></a></div>
</div>
</div>

</section>
<!--▲▲▲▲▲ここまで「サムネイルスライドショー」-->

ご使用上の注意点

画像(img)は必ず「4枚以上」の「偶数」で配置して下さい。それ以外だと途中で表示が崩れる場合があります。

主なスタイルは

cssフォルダのstyle.cssから「.slide-thumbnail1」でテキスト検索してみて下さい。詳しい解説もあります。

右から左へ移動するスタイル

<div class="img rtl">

左から右へ移動するスタイル

<div class="img ltr">

速度調整

jsフォルダのmain.js内の、
// サムネイルスライドショー
の中にある
var baseAnimationTime = 30;
の数値で調整できます。