Pixelating Images Using jQuery and Canvas - pixel-flow

Pixelating Images Using jQuery and Canvas - pixel-flow

jQuery PluginsjQuery Other PluginsjQuery pixel-flow

Pixelating Images Using jQuery and Canvas - pixel-flow

pixel-flow is a jQuery image filter plugin that helps you implement pixelating effects on any images using Html5 canvas.

See also:

How to use it:

1. Load the latest version of jQuery library and the jQuery pixel-flow plugin in the html document.

<script src="jquery.min.js"></script>
<script src="scripts/pixel-flow.js"></script>

2. Load the GSAP's TweenMax.js in the document if you wish to implement animated pixelating effects on the images.

<script src="TweenMax.min.js"></script>

3. Basic usage:

$.fn.PixelFlow( img, options )

4. Available options to create custom pixelating effects.

resolution : 16,
offsetX : 0,
offsetY : 0

Change log:

2018-03-12

  • bugfix

2015-09-30

  • corrected implementation of requestAnimationFrame

2015-05-16


This awesome jQuery plugin is developed by JamesNimlos. For more Advanced Usages, please check the demo page or visit the official website.

  • Publication date: 12.03.2018
  • Source