[JS]一つ一つのパネル表示をカスタマイズできるスライドショーのスクリプト -imgPlayer

一つ一つのパネルを異なるサイズで、最適な位置に表示し、異なる背景やアニメーションを設定できるスライドショーのスクリプトを紹介します。

デモのキャプチャ

imgPlayer
デモページ

[ad#ad-2]

デモでは10枚のパネルがセットされており、それぞれ異なるサイズ、最適な位置で表示し、さまざまなアニメーションで切り替わります。

デモのキャプチャ

2枚目を表示したキャプチャ
静止画ではその楽しさが分からないので、ぜひデモをどうぞ。
デモページ

スライドショーの操作は、画像の左右のアロー、下のナビゲーション、キーボードの矢印キーに対応しています。

実装は少し面倒で、個々のパネルごとに座標とサイズなどを指定します。
キャプションも設定できます。

JavaScript

パネル(一枚)の設定例です。

[221,30,386,518,{
	onStart: function(){
		darkStyle();
		$('#text').html('The plugin allows to slide through pre-defined details of an image. Usecases are e.g. webcomics or presentations.');
	}
}]

スクリプトのダウンロードページは、下記からどうぞ。

[ad#ad-2]

sponsors

top of page

©2018 coliss