[JS]大きな画像に最適な画像ギャラリーのスクリプト -jbgallery
ページの背景を使用したダイナミックな画像ギャラリーのスクリプトを紹介します。
デモはコンテンツ箇所を消すことも可能で、ブラウザのサイズに合わせて比率を維持しまま拡大することもできます。
コンテンツを消したキャプチャ
ギャラリーの操作は自動と手動に対応しており、デモでは右上にコントールボタンがあります。
操作はキーボードの矢印キーでも可能です。
ギャラリーのコントールボタン
コントールは上記のシンプルなタイプだけでなく、サムネイルやナンバータイプのものも用意されています。
menu -slider
サムネイルタイプのコントロール
オプションではコントロールだけだなく、多彩なカスタマイズが可能です。
- 画像のスタイル：ズーム、センタリング
- キャプションの有無
- ポップアップの有無
- フェードなどのアニメーションの時間
- など
動作テストを行ったブラウザはIE6/7/8, Fx3.5, Safari3.2/4, Chrome, Op9/10とのことです。
※ズーム時にOperaのキーボード操作で不具合があるそうです。
Post on:2010年4月6日
Comments
hide
on 2010年4月6日
いつもエントリー楽しみにしています。
この手のギャラリーってあまり見たことないですね。
サムネイルをクリックするタイプがほとんどだと思いますが（勉強不足ですかね）、アイデアがいいですね。参考にして作ってみます。
10時のヘッドライン | CROSS SBM
on 2010年4月6日
[...] 「サイバー犯罪とハクティビズム」レポートが発表されるnewsing:1 [JS]大きな画像に最適な画像ギャラリーのスクリプト -jbgallery | コリスはてブ:8 アップル、iPhone OS 4.0の発表イベントを4月8日に開催livedoor:3 [...]
freewebdev.jp
on 2010年4月8日
大きな画像に最適な画像ギャラリーのスクリプト -jbgallery
「jbgallery 2.0」
ページの背景を使用したダイナミックな画像ギャラリーのスクリプトを紹介します。
デモはコンテンツ箇所を消すことも可能で、ブラウザのサイズに合わせて比率を維持し…