• かちびと.net

    jQueryで背景画像をフルスクリーン表示してスライドショーに出来るやつ色々。必要になりそうなので備忘録がてら調べてみました。まだ使ったことが無いのもありますが。

    Kudos for

    WordPress jQuery
  • About This

    Web制作に役立つTips、チュートリアル、、マーケティングに役立つ情報などのリソースをほぼ毎日配信しています。宜しければメモ代わりにご利用下さい。詳しい情報はAbout me またはhumans.txtをご覧下さい。

    Kachibito.net is a community-based website for web designers and developers. The site includes a popular weblog, a design gallery, a open source software, design tips, and the various web-news.

  • Links

jQueryで背景画像をフルスクリーン表示してスライドショーに出来るやつ色々

スポンサーリンク

気が向いたのでメモ。背景に配置した
画像をフルスクリーンで表示して、更
にスライドショー化できるjQueryのプ
ラグインとか。さほど数は無いですけ
ど・・・使う可能性があるかもなので
備忘録的にまとめておきます。

タイトル考えるの結構面倒くさいので適当になってきました。語彙が中学生レベルですが気にしないで下さい。

さて、フルスクリーンにした背景をスライドに出来るjQueryいろいろです。ほぼ択一っちゃ択一なんですけど・・・ちょっと出来上がりすぎていじりにくいので他もチェックしたい、という事で調べたものを羅列しておきます。触ったこと無いのもあるのでその程度の記事という事で。

Supersized


定番の高機能プラグインです。IE6では動作しません。スマートフォンでも大丈夫っぽい。多数のオプションも用意されており、FlickrAPIにも対応してるくさいです。ライセンスはMIT/GPLのデュアルライセンス。

Supersized

bgStretcher


昨日が初見だったんですが、結構良さそう。スライド、フェード、エフェクトなしを選択できて、IE6でもなんとか表示出来るみたいだけど、フェードが動いて無いかもです。軽量でシンプルなので導入しやすい印象でした。スマフォでも問題なさそう。ライセンスが見当たらないのであとで再確認か、連絡。

bgStretcher

Fullscreen Gallery with Thumbnail Flip


プラグインではなくチュートリアルですね。クロスブラウザで動作。スライドは手動かマウスホイールなので、必要なら自動再生機能を別途加えないとなりません。

Fullscreen Gallery with Thumbnail Flip

Full Page Image Gallery with jQuery


こちらもチュートリアルですね。以前やっつけでWordPressのテーマにしました。マウスにあわせて拡大された画像も動きます。尚、IE6では動作しません。かっこいいけど汎用性は無いですかね・・

Full Page Image Gallery with jQuery

JBGALLERY


なかなか汎用性のありそうなプラグインです。デモは若干動作が怪しいですがw IE6でも一応動作します。ライセンスはGPLとなっています。

JBGALLERY

Animated fullscreen background image slideshow


全画面を使用したコンテンツスライダーです。エフェクトがクールなんですが、デモではIE8以下でナビゲーションが出てくれません。CSSでどうにかなるかな。ライセンスはちょっと未確認です。

Animated fullscreen background image slideshow

JQUERY.MB.BGNDGALLERY


こちらは以前紹介したプラグインです。現状ではIE6と7は動きません。シンプルで良い感じなのでちょっと調べてみたいところ。

JQUERY.MB.BGNDGALLERY

jQueryで全画面表示するギャラリーを作るチュートリアル


ちょくちょく拝見させて頂いている、webOpixelさんのチュートリアル記事。シンプルで良い感じです。クロスブラウザ対応で動作も問題なし。素晴らしい。

jQueryで全画面表示するギャラリーを作るチュートリアル

おまけ:YTPLAYER


おまけ。以前ご紹介したライブラリで、Youtubeを全画面に表示して透過、背景してい出来るやつです。

YTPLAYER

以上、全画面使ったスライドギャラリーのライブラリのメモでした。

URL :
TRB :

Ads

Posts

Contact

Services