背景画像をスライドショー付きでフルスクリーン表示にする方法「jQuery MaxImage」

      2015/11/17

背景画像をスライドショー付きでフルスクリーン表示にする方法「jQuery MaxImage」

背景画像をブラウザ幅いっぱいにフルスクリーン表示をさせ、
かつ画像をスライドショーできるスクリプト「jQuery MaxImage」をご紹介します。

まずはこちらのデモをご覧下さい。

サンプルデモ・ダウンロードはこちら

ブラウザを目一杯広げても、画像が切れないのがわかります。
画像が小さすぎると伸びたときにボヤけるのである程度大きめの画像を用意しましょう。

画像はimgタグでhtml上に配置するのが特徴です。
オプションにより微調整やセッティングが可能です。

HTML

 

オプション例

スライドショーの有無【slideShow : true , false】
スライドショーのタイトルの有無【slideShowTitle : true , false】
スクロールバーの有無【overflow : true , auto , hidden】
画像の基準位置【verticalAlign : top , center , bottom】

サンプルデモ・ダウンロードはこちら

背景画像をスライドショー付きでフルスクリーン表示にする方法「jQuery MaxImage」

http://www.aaronvanderzwan.com/maximage/
https://github.com/akv2/MaxImage/