Glitch is a jQuery plugin for creating animated glitchy effects on text. It can be seen on many elements of this site (title, menu, headings, links) (written in 2013, site has changed since then). Plugin works by duplicating the target element and then changing its width/height/top/left to create glitchy effect. It is released under MIT licence.
Download it here.
Instructions
Being a jQuery plugin, this plugin requires jQuery. Other than that it should be included in page header. To use it, call function glitch() on target jQuery object.
<html>
<head>
<title>glitch example</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script src="glitch.jquery.js"></script>
<script type="text/javascript">
$(function(){
$('span.block').glitch();
});
</script>
</head>
<body>
<span class="block">Glitch me</span>
</body>
</html>Options
Glitch plugin can be controlled with few initialization options:
* bg - (optional) background color
* maxint - max interval between glitchings (default 20)
* minint - min interval between glitchings (default 2)
* maxglitch - max number of twitches (default 5)
* hshift - max horizontal shift in pixels (default 3)
* vshift - max vertical shift in pixels (default 3)
* direction - slicing direction - 'horizontal', 'vertical' or 'random' (default is horizontal)
