Skip to content
jQuery plugin to pixelate images and, optionally, reveal on hover
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
dist
examples
.editorconfig
.eslintrc.json
.gitattributes
.gitignore
README.md
package-lock.json
package.json
pixelate.jquery.json
pixelate.min.js

README.md

pixelate.js

pixelate.js is a simple library and jQuery plugin to pixelate any set of images and optionally reveal them on hover.

Demo here

Usage

pixelate.js can be used with jQuery:

$('img').pixelate();

Or without via HTML data attributes:

<img src="test.jpg" width="200" height="200" data-pixelate>

Options

  • value The percentage of pixelation to perform, a value between 0 and 1
  • reveal Reveal the image on hover and remain revealed if clicked
  • revealonclick Reveal the image on click. When combined with reveal, it will remain revealed after being clicked.

These options may be specified by data tags, like so:

<img src="img.jpg" data-pixelate data-value="0.5" data-reveal="false">

or by jQuery/JavaScript:

$('img#myimage').pixelate({ value: 0.5, reveal: false });

License

MIT

You can’t perform that action at this time.