Jquery Image Projection

Jquery Image Projection simulates image projection. It works by using two similar images for the original and the projected image.

Whenever the surface is hovered, the viewfinder and the projected image come up. Everything covered by the viewfinder is shown on the projected image.

• denizli escort
• denizli escort
• didim escort
• düzce escort
• edirne escort
• edirne escort
• edremit escort

Source: github.com

1. INCLUDE JS FILES

<script src="javascripts/jquery.min.js"></script>
<script src="javascripts/image.projection.js"></script>

2. HTML

<div class="wrap">
  <div class="overlay"></div>
  <img src="images/sample-halved.jpg" id="sampleimg" data-pimg="images/sample.jpg" />
</div>

3. JAVASCRIPT

$(".wrap .overlay").imageProjection($("#sampleimg"));