W3.JSHTMLスライドショー
スライドショーを開始します。
w3.slideshow(selector, interval (milliseconds))
例
<img class="nature" src="img_snowtops.jpg">
<img class="nature" src="img_mountains.jpg">
<img class="nature" src="img_nature.jpg">
<script>
w3.slideshow(".nature");
</script>
自動開始なし
スライドショーが自動的に開始されないようにするには、間隔パラメータを0に設定します。
例
w3.slideshow(".nature", 0);
次のスライド
スライドショーを閲覧するためのボタンを追加します。
スライドショーを開始すると、w3.slideshow()関数はスライドショーを表すオブジェクトを返します。
var
myShow = w3.slideshow(".nature", 0);
スライドショーオブジェクトには、next()やprevious()などのプロパティとメソッドが含まれています。
例
<button onclick="myShow.previous()">Previous</button>
<button onclick="myShow.next()">Next</button>
その他のスライドショー
スライドショーには、任意のHTML要素を含めることができます。
CSSセレクターを使用してどちらを定義します。
例
ヘッダー:
<h1 class="city">London</h1>
<h1 class="city">Paris</h1>
<h1
class="city">Tokyo</h1>
<script>
w3.slideshow(".city");
</script>