title: Pure css3 parallax and mobile
body: <p>I'm using transform3D to achieve a pure css parallax effect.
  I have a really messy demo setup here:
  <a href="http://codepen.io/anon/pen/nGAvw" rel="nofollow">http://codepen.io/anon/pen/nGAvw</a></p>
  
  <p>This is the main code that does the translation:</p>
  
  <pre><code>transform: translateZ(-1px) scale(2);
  z-index: -1;
  transform-style: preserve-3d;
  </code></pre>
  
  <p>I would like my parallaxed image to be clipped using overflow:hidden.
  This works fine on desktop Chrome / Safari but stops working on Mobile Safari.
  From my further experiments it works fine on Android but stops working on iOS7.</p>
  
  <p>Any idea how to solve this?
  Is there any way to clip translated object on iOS?</p>