Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

blurify.js is a tiny(~2kb) library to blurred pictures, support graceful downgrade from `css` mode to `canvas` mode.

Notifications You must be signed in to change notification settings

JavaScriptCollection/blurify

Repository files navigation

blurify

dependencies devDependencies

blurify.js is a tiny(~2kb) library to blurred pictures, support graceful downgrade from css mode to canvas mode.

Installation

$ npm i blurify

Demo

Demo

Usage

blurify(options)

blurify the images with given options:

  • images { Element }, blurify target elements.
  • blur { Int }, extent of blur, defaulting to 6.
  • mode { String }, mode of blurify.
    • css: use filter property.(default)
    • canvas: use canvas export base64.
    • auto: use css mode firstly, otherwise switch to canvas mode by automatically.
import blurify from 'blurify';
new blurify({
 images: document.querySelectorAll('.blurify'),
 blur: 6,
 mode: 'css',
});

Change log

v1.0.7

  • fault-tolerance process

v1.0.6

  • fixed toArray bugs

v1.0.5

  • add auto mode

v1.0.4

  • add css mode

v1.0.3

  • fixed image cross origin issue

v1.0.2

  • fixed images reference error

About

blurify.js is a tiny(~2kb) library to blurred pictures, support graceful downgrade from `css` mode to `canvas` mode.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 85.0%
  • HTML 15.0%

AltStyle によって変換されたページ (->オリジナル) /