Installation
Step 1
Copy and paste this code on your web page before </head>
tag:
<script src="js/jquery-3.4.1.min.js"></script>
<script src="js/glitcher.js"></script>
<link rel="stylesheet" href="css/glitcher.css">
Don't include jQuery library if you already have it
Be sure you have correct src
path according to your file structure.
Step 2
Add class glitcher
to img
, div
or picture
tag. If you use div
tag please add background image via CSS property background-image
or inline style.
Examples:
<img class="glitcher" src="image.jpg">
or
<picture class="glitcher">
<source media="all" srcset="assets/img/image.jpg, assets/img/image@2x.jpg 2x">
<img src="assets/img/image.jpg" alt="" title="">
</picture>
or
<div class="glitcher" style="background-image: url('image.jpg')"></div>
or
.div_with_glitcher_class {
background-image: url('image.jpg');
}