jQuery Plugin To Allow You To Erase Single Image To Reveal

javascript-reveal-scratch-card

Touch2Reveal jquery plugin to allow you to scan erase one image to reveal another under it.

scratch card using jquery, javascript scratch card, jquery scratch card plugin, scratch card animation, html scratch off effect

How to make use of it:

1. Touch2Reveal.css and Touch2Reveal.js into the webpage.

<link rel="stylesheet" href="Touch2Reveal.css">
<script src="Touch2Reveal.js"></script>

2. Create an empty DIV container with a unique ID as follows:

<div id="Touch2Reveal"></div>

3. Create a new Touch2Reveal object and select before/after photos.

var touch2reveal;
window.onload = function(){
  touch2reveal = new Touch2Reveal(document.getElementById('Touch2Reveal'),'before.gif','after.jpg',{
    // options here
  });
}

4. Possible options with default values.

brushSize:window.innerWidth / 20,
softBrush:true,
revealTarget:{},
ratioToShow:.5,
onReveal:function(){}

Touch-enabled Virtual Scratch Card With JavaScript, Touch2Reveal Plugin/Github


See Demo And Download

Official Website(mattlohkamp): Click Here

This superior jQuery/javascript plugin is developed by mattlohkamp. For extra Advanced Usages, please go to the official website.