• RSS

jQueryプラグイン・ライブラリ の記事一覧

[JS]シンプルなフルスクリーンメニューのjQueryプラグイン「jQuery fatNav」

ハンバーガーメニューをクリックして、フルスクリーンでナビゲーションメニューを表示できるjQueryプラグイン「jQuery fatNav」のご紹介です。
続きを読む

[JS]テキストをクリップボードにコピーさせることができるプラグイン「clipboard.js」

ソースコードやテキストをクリップボードにコピーしてもらうのに便利なjQuery プラグイン「clipboard.js」のご紹介です。
続きを読む

[JS]アニメーションの種類も豊富なローディング用プラグイン「fakeLoader.js」

ページ読み込み時のローディングを簡単に実装できるjQueryプラグイン「fakeLoader.js」のご紹介です。

fakeLoader.jsにはローディングのアニメーションが最初から7種類用意されており、またローディング画面の表示時間や背景色などの設定も可能ですので、非常に便利なプラグインではないかと思います。
続きを読む

[JS]メールの二重送信を防止するjQueryプラグイン「jQuerty Form disable on submit」

フォームで送信ボタンがダブルクリックされ、メールが二重送信されてしまうことを防ぐためのjQuery プラグイン「jQuery Form disable on submit」のご紹介です。

※jQueryを使うため、サーバーサイドではなくクライアントサイドでの防止策になります。
続きを読む

[JS]ブラウザに合わせて背景画像を拡大・縮小表示できるjQueryプラグイン「maxImage」

ブラウザのサイズに合わせて背景画像を伸縮できるjQueryプラグイン「maxImage」のご紹介です。

1枚の背景画像を置く以外にも、複数枚の画像をフェードイン・フェードアウトで切り替え表示させることもできますので、非常に便利なプラグインではないかと思います。
続きを読む

[JS]特定の要素にブラー効果(ぼかし)を与えるjQueryプラグイン「Foggy」

スマホアプリ起動時のスプラッシュ画像などにもよく見る「磨りガラス風のぼかし」効果ですが、

特定の要素に対してこのぼかし効果を与えることができるというjQueryプラグイン「Foggy」のご紹介です。
続きを読む

[JS]高さの異なるコンテンツでもブロックレベル要素で揃える「jquery.heightLine.js」

レスポンシブWEBデザイン対応で、コンテンツの中身が変わっても、ブロックレベル要素の高さを揃えることができるjQueryプラグイン「jquery.heightLine.js」のご紹介です。
続きを読む

[JS]マウスオーバーでカラー画像を白黒にできるjQueryプラグイン「jQuery.BlackAndWhite」

カラーの画像をマウスオーバーで白黒に切り替えることができるjQueryプラグイン「jQuery.BlackAndWhite」について、設置方法と簡単なデモをご紹介します。
続きを読む

[JS]Bxslider でマウスオーバーで画像をスライドさせる方法

レスポンシブWEBデザイン対応で、カルーセルやサムネイルページャー(サムネイル付きスライド)などが可能な高機能スライドプラグイン「Bxslider」ですが、

サムネイルやページングのリンクを「クリック(click)」するのではなく、「マウスオーバー(hover)」で画像をスライドさせるというカスタマイズが必要になったので、今回はその方法をまとめました。
続きを読む

[JS]jQuery で高さの異なる要素を最大値で揃える方法

float に横並びにした要素の高さを最大値で揃えるためには、以前に紹介させていただいたCSS を使う方法 以外にも、jQuery で対応することが可能ですので紹介させていただきます。
続きを読む

[JS]文字量に応じてテキストエリアが自動でリサイズするjQueryプラグイン「jQuery Autosize」

フォームのテキストエリアtextarea の高さを、テキスト量に応じて可変にできるjQuery プラグイン「jQuery Autosize」のご紹介です。

テキストエリアに文字をどんどん打って行くと、文字量に応じてテキストが下へ下へと広がって行きますので、特にスマートフォンサイトのような限られた表示領域でテキストエリアを使う場には必須のプラグインではないかと思います。
続きを読む

[JS]Lightbox のように画像を拡大表示して、スワイプ操作でスライドできるjQuery プラグイン「Swipebox」

スマホやiPad などのタブレット向けに最適化されたレスポンシブWEBデザイン対応のサイトで、Lightbox のような画像の見せ方を実装したい場合に便利なプラグイン「Swipebox」のご紹介です。

Swipebox は単体画像をLightbox 風に表示できるのはもちろん、複数枚の画像の切り替え表示をスワイプ操作で出来る点が秀逸です。
続きを読む

[JS]複数並んだブロック要素の高さを最大値で揃えるjQuery プラグイン「jQueryAutoHeight」

float などで横に並べたブロック要素の高さを揃えることができるjQuery プラグイン「jQueryAutoHeight」のご紹介です。

jQueryAutoHeight は、複数並んだブロック要素を高さの最大値で揃えて表示できるだけでなく、ブロック要素を横に何個並べるか?というカラムの指定もできますので、レイアウトの自由度も高くて非常に便利なプラグインです。
続きを読む

[JS]SWF や WMP などの動画ファイルもLightbox 風に表示できるjQueryプラグイン「Shadowbox」

画像をLightbox 風に表示させるプラグインの中でも、個人的に最近お気に入りなのが今回紹介させていただくShadowbox です。

Shadowbox は、画像単体のオーバレイ表示や複数画像のスライド表示ができるだけでなく、インラインコンテンツやWMP、SWF、FLV、QuickTime などの動画ファイル、Flashにも対応しているという、かなり高機能なプラグインです。

しかもレスポンシブWEBデザイン対応なので、今や必要不可欠とも言えるスマートフォンやiPad 向けのサイトにも使えます。
続きを読む