個人的に役立ったデザイン素材やTips、WEBサービス、役立つグッズ、あれやこれやをご紹介

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介

2014年に登場したベストなjQueryプラグインを50個ご紹介します。
レイアウト系のプラグインから、メニュー系、メディア系、スライダー系、イメージギャラリー系、テキストエフェクト系、フォーム系など、さまざまなjQueryプラグインがまとめられています。
2015年以降も、制作の現場で役立つこと間違いなし!
ぜひともチェックしてみてくださいね。

jQuery Plugins for Web & Mobile Layouts

pagePiling.js

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
1ページスクロール用のプラグイン。
フルスクリーン対応です。
IE8あるいはOpera12にも対応しています。
pagePiling.js

fullPage.js

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
こちらも、1ページスクロール用のプラグイン。
フルスクリーン対応で、サブコンテンツがある場合は、横スクロールしたり、レスポンシブ対応など、シンプルだけど、とても使い勝手のいいプラグインです。
fullPage.js

jQuery Tilted Page Scroll

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
傾いた3Dスクロール効果を実装できるプラグイン。
インパクトがあります。
jQuery Tilted Page Scroll

FixedContent.js

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
コンテンツの一部を、スクロールしても固定表示してくれる便利なプラグインです。
見せたい情報を的確に読者に提示できます。
FixedContent.js

gridscrolling.js

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
ページスクロールものですが、sectionとasideでマークアップするだけで、縦横のナビゲーションを設置できるプラグイン。
キーボードのカーソルキーでも操作可能です。
gridscrolling.js

Flickerplate

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
フリックさせたいコンテンツを簡単に実装できる軽量プラグイン。
Flickerplate

jInvertScroll

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
水平方向のパララックスるスクロールを実装できるプラグイン。
jInvertScroll

Animsition

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
ページ遷移をCSSアニメーションつかって簡単に実装できるようになるプラグイン。
実装できるアニメーションは実に58もあります。
インパクトのあるページ遷移を実装する場合にとっても便利です。
Animsition

scrollToBySpeed.js

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
スクロールエフェクトを実装するためのプラグイン。
特定の要素の位置を指定でき、スピードも設定もできます。
scrollToBySpeed.js

Brick Work

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
Masonry風というか、Pinterest風のレイアウトを、わずか15kで実装できてしまう軽量プラグイン。
レスポンシブにも対応しています。
Brick Work

ScrollMe

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
スクロールエフェクトを実装できる軽量プラグイン。
ScrollMe

jquery.smoothState.js

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
スムーズで美しいページ遷移エフェクトを実装できるプラグイン。
jquery.smoothState.js

multiscroll.js

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
1ページスクロール用のプラグインですが、上下別々にコンテンツが現れるというエフェクトになっています。
実装すればかなりのインパクトが。
multiscroll.js

jquery.matchHeight.js

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
コンテンツの高さを厳格に揃えてくれるプラグイン。
レスポンシブにも対応しています。
jquery.matchHeight.js

jQuery Navigation & Menu Plugins

Slidebars

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
左右からニュッとでてくるオフカンバス風のメニューを簡単に実装できてしまうプラグインです。
レスポンシブにも対応しています。
詳しい実装方法は「[JS]スクリプト初心者でも簡単!レスポンシブ対応のナビゲーションやコンテンツを横から表示するスクリプト -Slidebars」を御覧ください。
Slidebars

scotchPanels.js

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
こちらもオフカンバスメニューを実装できるプラグインです。
scotchPanels.js

jQuery Plugins for Media (Images & Video)

Focuspoint

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
ウインドウサイズを拡大し縮小した際に、画像のフォーカスポイントを設定できてしまう便利なプラグインです。
背景画像をフルスクリーンで実装する場合にはとても役立ちます。
Focuspoint

Fluidbox

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
lightbox系プラグイン。
画面いっぱいに画像を広げます。
動作も軽快です。
Fluidbox

GifPlayer

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
Gifアニメーションの再生・停止を実装できるプラグイン。
GifPlayer

rowGrid.js

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
画像をグリッドレイアウトに配置するプラグイン。
無限スクロールにも対応しています。
rowGrid.js

Magneticmediajs

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
メディアコンテンツをスタイリッシュに見せるプラグイン。
Magneticmediajs

SVGMagic

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
SVG非サポートブラウザで表示したときに、PNG画像に自動で変換してくれるプラグインです。
これがあれば、安心してSVG画像を利用できますね。
SVGMagic

Vide

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
背景フルスクリーンに動画を配置するためのプラグイン。
Vide

Data-Img

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
画像表示をレスポンシブ対応にしてくれるプラグイン。
単なるレスポンシブ対応ではなく、画面サイズによって複数画像を切り替えたりすることができるようになります。
Data-Img

Dense.js

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
retina対応の画像を簡単に提供してくれるプラグイン。
Dense.js

Covervid

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
HTML5 videoを背景フルスクリーン表示にしてくれる軽量プラグイン。
Covervid

jQuery-Cropbox<

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
画像の切り抜きをブラウザで行えるプラグイン。
jQuery-Cropbox

Face Detection

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
顔認識を行えてしまうプラグイン。
Face Detection

BttrLazyLoading

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
画像を読み込む際に、さまざまなアニメーションを実装できるプラグイン。
BttrLazyLoading

jQuery Slider, Carousel & Gallery Plugins

Simple jQuery Slider

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
シンプルなスライドショープラグイン。
Simple jQuery Slider

FSVS

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
CSS3トランジションを利用して、フルスクリーンの縦型遷移を実装するプラグイン。
FSVS

anoFlow

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
レスポンシブ対応のライトボックスギャラリープラグイン。
anoFlow

nanoGALLERY

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
レスポンシブ&タッチパネル対応の画像ギャラリープラグイン。
nanoGALLERY

Photopile JS

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
画像を乱雑に配置したように見せる画像ギャラリープラグイン。
Photopile JS

Justified.js

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
画像をグリッド上に整然と配置する画像ギャラリープラグイン。
Justified.js

Shuffle Images

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
カーソルを画像に合わせると画像がシャッフルされるプラグイン。
Shuffle Images

Skippr

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
とってもシンプルで軽量なスライドショー用プラグイン。
レスポンシブ対応で、オートプレイなどのオプションもあります。
Skippr

jQuery Text Effect Plugins

jQuery.fontFlex.js

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
画面サイズに合わせてフォントサイズを変更してくれる軽量プラグイン。
jQuery.fontFlex.js

t.js

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
タイプライターのようなエフェクトを追加してくれるプラグイン。
t.js

CurvedText

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
テキストをカーブさせるプラグイン。
円、波、渦巻きなど、さまざまなカーブに対応しています。
CurvedText

Morphext

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
テキストにCSS3アニメーションを実装できるプラグイン。
重要な箇所を色や文字の大きさ以外で表現したい場合に便利です。
Morphext

Splitchar

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
文字を上下左右に二分割あるいは三分割などにして、それぞれに着色できるプラグイン。
Splitchar

jQuery Form Element Plugins

BootstrapValidator

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
バリデーション機能をフォームに実装するBootstrap用プラグイン。
BootstrapValidator

Labelauty

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
美しいチェックボックスらラジオボタンを実装できるプラグイン。
Labelauty

Guardian

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
フレキシブルなバリデーション機能をフォームに実装するプラグイン。
Guardian

fontIconPicker

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
フォントアイコンのピッカーを実装できるプラグイン。
fontIconPicker

HideSeek

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
リストのインクリメンタル検索ができるようになるプラグイン。
HideSeek

ClockPicker

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
時間の入力をピッカーで実装プラグイン。
ClockPicker

jQuery Utility Plugins

jQuery Confirm Mailto

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
mailto:を利用しているときに、いきなりメールソフトを立ち上げるのではなく、開くかどうかの確認を表示してくれるプラグイン。
jQuery Confirm Mailto

jQuery prettySocial

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
Pinterest, Twitter, Facebook, Google+ボタンを実装するためのプラグイン。
jQuery prettySocial

jNottery

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
ページにノートを追加できるようにするプラグイン。
jNottery

Responsive Tabs

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
レスポンシブに対応したタブ切り替えを実装できるプラグイン。
Responsive Tabs

jquery.adaptive-backgrounds.js

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
画像からドミナントカラー(支配色)を抽出し、背景色に適応するプラグイン。
jquery.adaptive-backgrounds.js

おまけ

jQuery.planetarium

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
プラネタリウムを作れるプラグイン。
球体を自動回転させるアニメーションエフェクトを実装できます。
マウスに反応して回転を止めるといったこともできます。
jQuery.planetarium

jquery.wanker.js

jQueryベストプラグイン2014 使えるプラグイン50選をご紹介
画面サイズの変更に注意を促すメッセージを表示できるプラグイン。
jquery.wanker.js

ここまでは、「50 Most Useful jQuery Plugins from 2014」を参考に作成しました。

お役に立てましたら、以下どれでも結構のですので、ポチリと……。

  • 0
  • 0
  • 4
  • 28

Amazonアソシエイト・プログラム規約による記載
当サイトはamazon.co.jpを宣伝しリンクすることによってサイトが紹介料を獲得できる手段を提供することを目的に設定されたアフィリエイト宣伝プログラムである、Amazonアソシエイト・プログラムの参加者です。

この記事を読んだ人はこんな記事も読んでいます

CSS3をお手軽・簡単にするCSS3関連ツール&ジェネレーター43

ベンダープレフィックスを自動で付けられるPrefixrがサービス終了!が後継者「Express Prefixr」現る

ベンダープレフィックスを簡単につけることができるWEBサービスPrefixr。 ところが、このPr

記事を読む

無料で利用できる検索フォーム12(CSS3,HTML5,jQuery)

検索フォームはサイトに欠かせない重要な要素の1つになっています。 最近では、アニメーションを用いた

記事を読む

アイコンはCSSで!フォントもSVGも使用しないCSSだけのアイコンセット「Icono」

アイコンはCSSで!フォントもSVGも使用しないCSSだけのアイコンセット「Icono」

CSSだけでつくられたアイコンセットのご紹介です。 近年のアイコンというと、アイコンフォントかSV

記事を読む

全部無料!レスポンシブWEBデザイン制作を驀進させるレスポンシブ対応テンプレート121

2013年も気がつけば、もうあとすこしとなりました。 そんななか、無料で利用できるフリーのレスポン

記事を読む

参考にしたい!シンプルで美しいWEBデザイン50(〜2014.02)

2014年2月現在までに公開されているサイトのうち、美しくスッキリしたデザインをコレクションしてみま

記事を読む

これは魅力的!CSSだけで実装できる画像ホバーエフェクト20

これは魅力的!CSSだけで実装できる無料の画像ホバーエフェクト22

CSSだけで実装できる魅力的な画像用のホバーエフェクトをご紹介します。 種類は全部で22種類です。

記事を読む

CSSで表現されたスゴワザのテキストエフェクト&チュートリアル19

CSS3では、CSSでさまざまなテキストエフェクトを実現することが可能です。 今回は、CSSで表現

記事を読む

トップ固定でレスポンシブ対応のナビゲーション/メニューを簡単に実装できる「Fixed Nav」

トップ固定で、レスポンシブ対応のナビゲーションが増えていますね。 これだけ増えてくると、トップ固定

記事を読む

人気のHTML/CSSコードサンプル25+おまけ2 from CodePen

CodePenはHTML,CSS,JSのコードサンプル配布サイトです。 紹介されているコードの種類

記事を読む

CSSボタンの参考になる!CSSでつくられたボタンが100以上コレクションされている「CSS Buttons」

CSSボタンのコピペに!CSSでつくられたボタンのコードが100以上コレクションされている「CSS Buttons」

CSSボタンの参考やコピペに使える、とても参考になるCSSボタンのコードがコレクションされているサイ

記事を読む