背景を効果的に魅せることができるjQueryプラグイン

  • このエントリーをはてなブックマークに追加

こんにちは、工藤です。

背景を効果的に魅せることができるjqueryプラグインをまとめました。

スライド関係

Skippr

1Skippr.-A-jQuery-plugin-for-creating-tasteful-slideshows
サイト
指定した背景いっぱいに画像が表示、スライドされるプラグインです。
軽量でレスポンシブにも対応しているのがうれしいです。

MaxImage2

2Basic-Example---MaxImage-2
サイト
こちらも背景いっぱいに画像が表示、スライドされるプラグインです。
オプションの種類が豊富で
  • 自動でフェードイン/アウトするスライドショー
  • 矢印付のスライドショー
  • 動画再生
など様々なことができます。


動画関係

Vide

3Vide---easy-as-hell-jQuery-plugin-for-video-backgrounds
サイト
背景で動画が再生されるプラグインです。導入がとても簡単なのでオススメです。
MP4/OGV/WebMの動画を用意していればブラウザによって最適なものを選んで自動で入れてくれます。
iOS/Androidはjpgを用意したら静止画で表示してくれます。

BigVideo

4BigVideo
サイト
こちらも背景で動画が再生されるプラグインです。
上記でご紹介した『Vide』と同じような仕様です。


tubular

5tubular--a-YouTube-Background-Player-jQuery-Plugin---Sean-McCambridge-Design
サイト
背景にYouTubeの動画を表示・再生できるプラグインです。
ファイルが用意できない場合などに便利ですね。


その他

Particleground

6Particleground-demo
サイト
以前もご紹介したかもしれないですが背景に幾何学模様を実装できるプラグインです。
ちょっとしたことですがおしゃれになりますね。


jquery.adaptive-backgrounds.js

7jquery.adaptive-backgrounds
サイト
画像のドミナントカラーを抽出して背景色に設定できるプラグインです。すごいですね…。
動的なサイトで効果的に使えたら便利だと思います。


以上です。それでは。


執筆者:工藤[ WEBデザイナー ]

WEBデザイナー。 最近はWordPressを触るのが好きです。よろしくお願いします。

関連記事

プログラミング

jQuery+PHPで大容量ファイルを分割アップロードするお話

ファイルのアップロードを行う際に注意しないといけないのが「アップロード容量」と「タイムアウト」です。 どちらもサーバーの設定に関わるところでレンタルサーバーでは対処しきれないところもあり、大容量にするとそれだけアップロードに時間がかかりタイムアウトが発生しやすくなります。 そこでフロント側で分割してファイルをアップし、バックエンド側で受け取った後に結合するようにするとよいでしょう 注意すべき点として通常のPOSTでの送信ではないため、あらかじめそこら辺を考慮した処理が必要とな […]

スマホアプリ

お子さまの安全を守るアプリ「みまもりキッズ」をリリースしました!

お子さまが学校や習い事、遊びに出かけたあと、「ちゃんと安全に過ごしているかな?」と心配になったことはありませんか? 不審者による事件が後を絶たない昨今、お子さまの安全を守るために、常に高い意識を持たれている保護者の方も多いのではないでしょうか。 そんな中、親子の安心をサポートする新しいアプリ「みまもりキッズ」が登場しました! 基本無料で、カンタンに使うことができます。 この記事では、アプリの魅力や使い方を詳しくご紹介します。 目次1 みまもりキッズは何ができるの?1.1 カン […]

WordPress

WordPressの会員限定記事配信プラグイン「Simple Analytics」をリリースしました!

WordPressのイベントカレンダープラグイン「Simple Analytics」をリリースしました! ※この記事は2024年10月現在の情報です。 目次1 Simple Analyticsとは?2 こんなお悩みにおすすめです3 Simple Analyticsで できること3.1 月別・週別アクセス数3.1.1 確認できる項目3.2 ページ別アクセス数3.3 外部サイトからのアクセス数3.4 地域・デバイス別アクセス数3.5 時間帯別アクセス数3.6 ページ毎の直帰率3. […]

株式会社8bit (エイトビット)

東京都目黒区でWebサイト制作、Webシステム開発などを行っております。
コーポレートサイトやWebサービスの企画・提案を得意としており、自社での経験を元にアイデアをカタチにするお手伝いをさせていただいております。

Web制作に関するご相談はお気軽にどうぞ

弊社に制作をご依頼いただく際の費用感をご確認いただける、
見積りシミュレーションをご用意いたしました。