Get new jQuery plugins just once a week
September 24, 2012
Glitch-js | A glitched effect for DOM elements
Glitch-js is jquery plugin that allows to apply the glitched effect to DOM elements and images.glitch.js depends on html2canvas so make sure you’ve loaded it before applying the effect.
To generate a canvas that contains a glitched version of the element, just call the glitch function passing in the element to glitch and an options object with a complete property that acts as the callback:
Two options :-
- amount The amount to glitch the image (default: 6)
- complete A callback that takes the glitched canvas as its only argument
On top of the glitch options, you can specify the following extra options for the transition:
- effect The transition effect to use. This may be “fade” or “slide” (default: fade)
- delay The delay after rendering the glitched element until starting the transition (default: 300)
- duration The duration of the transition effect (default: 500)
- zIndex The z-index to apply to the overlay. You might need to tweak this if you have things that appear above the element, or are using high z-indexes in your page
- borderSize The size of the top border. Set to 0 to disable, only used in slide mode
- borderColor The color of the top border, only used in slide mode
Created by Simon Hewitt
Glitched DOM elements
Sign up for our weekly newsletter.
10 Most Amazing Couple Gifts
A comprehensive guide to couple gift Ideas for Valentine’s Day, Weddings, Anniversaries for your spouse, friend, fiance, boyfriend / girlfriend.
Take me there !
Continue to jquer.in