title: Pinch to zoom with Hammer.js
body: <p>I want a pinch to Zoom function for an image. I want it to zoom in the area where the fingers are.</p>
  
  <p>My index is only</p>
  
  <pre><code>&lt;div id="wrapper" style="-webkit-transform: translate3d(0,0,0);overflow: hidden;"&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p>And my script for zooming and scrolling is similar <a href="https://github.com/EightMedia/hammer.js/blob/master/examples/pinchzoom.html" rel="nofollow">with this example</a>. I have made a few changes to fit with my project</p>
  
  <p>My problem is in </p>
  
  <pre><code>        case 'transform':
              rotation = last_rotation + ev.gesture.rotation;
              scale = Math.max(1, Math.min(last_scale * ev.gesture.scale, 10));
              break;
  </code></pre>
  
  <p>How can I change it so that it doesn't zoom into the center of the picture but at place where the first finger have touch the display?</p>
  
  <p>Sorry for my bad english :)</p>