Brusher

JavaScript

インタラクティブな背景を実装できる「Brusher」

Brusherはインタラクティブな背景を実装できる軽量なJavaScriptライブラリです。背景でマウスカーソルを動かすことで、それに合わせてぼやけた背景がクッキリ見えるようになります。遊び心があり、とてもおもしろいですね。

Brusher

デモ

デモではぼやけた背景が表示されていて、この背景内でマウスカーソルを動かすと、動かした部分がクッキリ表示されます。マウスカーソルをたくさん動かすことで背景がどのようになっているのかが分かってくるので、おもしろい機能ですね。

ちょっとした遊び心をサイト内に取り入れたい人にはピッタリな機能になるのではないでしょうか?

オプションには、image、keepCleared、stroke、lineStyle、autoBlur、autoBlurValueといった項目が用意されています。

また、デモページにはほかにも、Keep Cleared Sections、Without Background Demo、Sticky Blur Demo、Different Line Styleといった違うタイプのデモもあるので、気になる人はぜひチェックしてみてください。

Brusher

関連記事

  1. flatpickr

    JavaScript

    超軽量で使い方もカンタンな日付ピッカー「flatpickr」

    flatpickrはjQueryなどのライブラリに依存することなく動作…

  2. no-image

    JavaScript

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

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

  3. Add To Cart Interaction
  4. Bootstrap Navbar Sidebar

    JavaScript

    サイドに固定できるナビゲーション実装「Bootstrap Navbar Sidebar」

    Bootstrap Navbar Sidebarは、サイドに固定できる…

  5. Ion Zoom

    JavaScript

    シンプルで美しいLightbox系のjQueryプラグイン「Ion Zoom」

    シンプルで美しいLightbox系のjQueryプラグイン「Ion Z…

  6. anchor.js

    JavaScript

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

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

最近の記事

  1. macOS Mojaveのダークモード
  2. Olli
  3. 単語帳メーカー(Flashcard Maker App)
  4. 1Password 7

Facebookページ

PAGE TOP