title: Have to fire click event twice to trigger full screen mode on ipad
body: <p>I have a click event that calls the following code:</p>
  
  <pre><code>$('#video-overlay').on('click', '.media-thumb', function(e){
          $('.video-file')[0].play();
      $('.video-file')[0].webkitEnterFullscreen();
      e.preventDefault();
      });
  </code></pre>
  
  <p>In my chrome browser this works fine but on ipad i have to click .media-thumb twice to actually get to fullscreen mode, testing on ipad2 v:iOS5. Can anyone offer some light on how I can resolve this so .play() and .webkitFullscreen() get called together?</p>