概要
＜ループスライダー＞の主な特長としては、
- 常にループし続ける。
- スクリプト不要でスタイルシートのみの軽量化を実現。
- 設定はすべてモジュール上で完了。
- 画像幅はPC表示時のみ変更可能。（モジュール上で変更可）
- 画像下に説明文や画像全体にリンク付けも可。
- ループスピードは”一応”固定。（スタイルシート上で変更は可）
使い方
＜ループスライダー＞を設置したい箇所に以下のモジュールを挿入します。
[% module(【Volar2】ループスライダー（HTML）) %]
モジュールを開くと下のように画像挿入用のコードが5つ用意されてます。
あとは『（※画像を挿入）』のところをSIRIUS2の画像挿入機能で画像パスに差し替えるだけで完了です。
説明文が必要なら『（説明文をここに記載可能）』のところを好きなテキストで差し替えます。
不必要なら『（説明文をここに記載可能）』を削除します。
<div class="xxx">（※画像を挿入）（説明文をここに記載可能）</div>
デフォルトで5つの画像挿入用コードを用意してますが、速度一定で常にループしているのであまり数が多いとじっくり見てはくれないと思います。
それでももしも数を増やしたい場合は先のコードを丸ごとコピーしてすぐ後ろにペーストすれば数は増やせます。
反対に減らしたい場合は減らしたいコードを丸ごと削除するか、前後をコメントアウトすれば一時的に非表示にもできます。
『ループスライダー』の関連記事
-
SIRIUS2テンプレート【Volar2】にはテーブル（表）のデータの背景にアイコンをつけたりセル幅を自在に調節できたりする便利な機能が搭載されてます -
SIRIUS2テンプレート【Volar2】では標準機能の＜画像レイアウト＞に専用のタグを足すだけでさまざまなレイアウト表示ができるようになります。 -
SIRIUS2の＜画像ギャラリー＞におけるスマホでの見せ方のカスタマイズをご紹介します。 -
SIRIUS2テンプレート【Volar2】では通常のヘッダーエリアを動画ヘッダーに簡単に切り替えることができます。 -
SIRIUS2テンプレート【Volar2】では通常のヘッダーエリアをフェード切り替え画像スライダーに簡単に切り替えることができます。 -
SIRIUS2テンプレート【Volar2】では1カラム形式のページに開閉式のサイドメニューを表示させることができます。 -
SIRIUS2テンプレート【Volar2】の1カラムページで使える＜フルワイド背景画像＞についての詳細ページ。 -
SIRIUS2テンプレート【Volar2】の1カラムページで使える＜フルワイド背景画像＞のシンプル版。使い勝手が向上しました。