blurify

JavaScript

画像にぼかし効果を実装できる軽量のJSライブラリ「blurify」

blurifyは画像にぼかし効果を実装することができるJSライブラリです。とても軽量(〜2KB)なライブラリなので、PCではもちろん、スマホやタブレットでもサクサク動作させたい人にはピッタリですね。

blurify

デモ

デモではフルスクリーンで表示された画像に、しっかりとぼかし効果がかかっています。実装方法もシンプルだし、ファイル容量も軽量なところがいいですね。

オプションは全部で、images、blur、modeの3つが用意されています。imagesにはぼかし効果をつけたい要素を指定します。blurはぼかし具合を数値で指定します。デフォルトは6です。

また、modeは3種類の中から選ぶことができます。具体的には、css、canvas、autoの3種類です。デフォルトはcssになっています。

軽量ながらもオプションによる手軽なカスタマイズも可能なので、画像にぼかし効果を加えたい人は、覚えておきたいライブラリといえそうです。

いちいち画像加工ソフトを使ってぼかしを入れるのは、何気にめんどくさいですからね。1枚だけならそれほど労力もかかりませんが、たくさん数が増えていくほど手間もかかってしまうので、そういう時にこの「blurify」を活用すると効率的だと思います。

blurify

jQuery Bar Rating選択範囲を評価ウィジェットに変換できる「jQuery Bar Rating」前のページ

フルスクリーンによるダイアログボックスを表示できる「jquery.confirmDialog」次のページjquery.confirmDialog

関連記事

  1. jquery-time-slider

    JavaScript

    時間と日付を選択できる「jquery-time-slider」

    jquery-time-sliderは時間と日付を選択できるjQuer…

  2. Tabslet

    JavaScript

    jQueryプラグインでタブ機能が実装できる「Tabslet」

    TabsletというjQueryプラグインを使えばWebサイトにタブ機…

  3. jsPanel3

    JavaScript

    多機能なフローティングパネルを実装できるjQueryプラグイン「jsPanel3」

    jsPanel3は、高度で多機能なフローティングパネル(ウィンドウ)を…

  4. no-image

    JavaScript

    レスポンシブ対応のjQuery Lightbox & Popupプラグイン「Flashy」

    Flashyはレスポンシブに対応したjQuery Lightbox &…

  5. JavaScript

    カスタマイズ性に優れたタグ入力ができるJSライブラリ・insignia

    insigniaはカスタマイズ性に優れたタグ入力を実装することができる…

  6. anchor.js

    JavaScript

    ページ内リンクをスムーズにスクロール移動できるjQueryプラグイン「anchor.js」

    anchor.jsはページ内リンクをスムーズなスクロールで移動すること…

最近の記事

  1. Apple WatchでのMacロック解除を無効
  2. オータムスイートポテトフラペチーノ
  3. 紅葉
  4. ナノケア EH-NA0E
  5. スターバックス コロンビア サンタンデール

アーカイブ

PAGE TOP