Maccle

jQueryだけで簡単にインタラクティブなサイトができる!目的別に探せるjQueryプラグインまとめサイト:Unheap

約 4 分
jQueryだけで簡単にインタラクティブなサイトができる!目的別に探せるjQueryプラグインまとめサイト:Unheap
Screenshot

UI、フォームデザイン、マルチメディア、その他あらゆるサイト用オブジェクトを、パパっとあっという間におしゃれにエレガントに仕上げてくれる、jQuery をベースにしたプラグインのコレクションサイト「Unheap」。

このサイト自体もとってもクールですが、自力でWebサイトやWordPressテーマなんかを作ったり、既存のデザインに組み込みたいときにかなり重宝するのでメモ。

プラグインの種類は、インターフェース、フォームオブジェクト、マルチメディア、ナビゲーション、その他のカテゴリに分かれていて、さらに各カテゴリにはサブカテゴリに分類されていてとっても便利!category

紹介しきれないので、適当にピックアップしたものをいくつか。

たとえばサイトの背景

bgStretcher

bgStretcherCSS3でも実現できますが、ディスプレイサイズやブラウザの表示サイズに関わらず、1枚の画像をサイトの背景画像にアスペクト比を保持してストレッチ表示できる jQueryプラグイン。
Plugin Page | Demo

BIGVIDEO.JS

bigvideojsこのプラグインはmp4フォーマットの動画をサイトの背景として再生するjQueryプラグイン。

軽量化のため、ビデオファイルからは音声パートを削除しておいた方がいいと思いますが、ambientオプションで無音で再生させることもできます。

なお、再生バーのスライダーコントロール用に、jQuery UI と jQuery imagesloaded プラグインも必要になります。
Plugin Page

Tubular

tubularこちらは自前のムービーではなく、YouTubeの動画IDを指定するだけでその動画をサイトの背景として再生することができます。
Plugin Page | Demo

たとえばフォームコントロール関連

味気ないフォームのコントロールだっていい感じに!

Uniform

uniforほとんどのフォームコントロールのデザインをおしゃれに統一できるjQueryプラグイン。

3タイプのテーマ(スキン)があります。
Plugin Page | Demo

jQRangeSlider

jQRangeSlideriPhone, iPadなどのタッチでバイスにも対応するおしゃれなスライダー。
例えば、開始と終了の日付を選んで対象の期間を指定したり、範囲を指定してGET/POSTしたい場合なんかに使えそうです。

オンライン上でリアルタイムにビジュアルカスタマイズができて、とっても便利!
Plugin Page | Demo

たとえばナビゲーションメニュー関連

最近じゃ jQueryだけで アニメーション付きのスライドメニューも簡単に設置できるようになりましたっ

Grid Accordion

gridaccordionメインメニューが縦割りで水平に並んでいて、さらにメインメニュー内のサブメニューは垂直に行で並んでいるアコーディオンメニュー。

メインメニュー、サブメニューどちらをクリックしても、びよーんとアニメーションして表示されます。
Download | Demo

liteAccordion

liteaccordionクリックすると横にスライドするアコーディオンメニュー。

サービスや商品紹介とか商用サイトに向いてそう。
Plugin Page | Demo

たとえばマルチメディア関連

RESPONSIVE & TOUCH-FRIENDLY AUDIO PLAYER

audioplayerHTML5, CSS3, Javascriptのみのオーディオプレイヤー。

レスポンシブ・ウェブデザインでタッチでバイス対応なので、iOSでバイスでもばっちりです!
Plugin Page | Demo

HTML5 Video Player

html5videoplayer読んで字の如く! HTML5製のビデオプレイヤー。

シークバー、ボリュームスライダー、プレイリスト、セッティングパネルを表示させることができます。
Plugin Page | Demo

デザイナーじゃなくたって、こんな便利なプラグインを組み合わせていけば、素人でもかなりイケてるWebサイトが構築できますね!

ScreenshotUnheap – A tidy collection of jQuery plugins

この記事を書いたひと

某IT系なんちゃってエンジニアヨーダ
Apple好きだけど盲目マカーは気持ち悪いと思ってる中道だと思い込んでるしがないダメダメエンジニア。

今もってるApple製品↓
Macbook Pro 15 inch, iMac 27 inch (Late 2009), iPhone 6 Plus, iPad (初代! いらない!)
Follow :

コメントはこちら

*

COMMENT ON FACEBOOK