Below you can find some examples that show you the basic usage of Pieces Wordpress Plugin.

A simple example

On document ready Pieces waits for 2 seconds and then performs the IN animation (with fade-in effect) called "pieces1".

Animations parameters

This example shows some paramaters we can use.
Try clicking on the image.


Pieces is responsive. Try clicking the below image and try to resize your browser (this animation is very slow to allow you to resize the window).

Starting an animation when the image become visible

This example performs an IN animation when the image become visible after scrolling the page.

Mouse Over

Pieces can also start an animation on mouse over, out and click. The following example performs an animation on mouse over.


In this example Pieces will perform the animation inside a masked box.