Create A Mosaic Transition Effect with jQuery and Canvas - Mosaic

Mosaic is a funny jQuery plugin that takes advantage of canvas element to pixelate an image like the mosaic reveal effect.

See also:

• Pixelating An Image Using jQuery Pixelate Plugin
• jQuery Plugin To Pixelate Images Using Html5 Canvas

How to use it:

1. Include jQuery library and the jQuery mosaic plugin in the web page.

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="js/jquery.mosaic.js"></script>

2. Insert an image into your web page.

<img src="demo.jpg" alt="Demo image" id="demo">

3. Call the plugin on the image and make the mosaic transition effect repeatable.

$('#demo').mosaic({
  repeat: true
});

---

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