title: Vimeo player JS API is not working in iOS
body: <p>I'm trying to use the API to play a video, but it only works after you click the play button in the player in iOS. In desktop and Chrome for Android, it is working fine.</p>
  
  <p><a href="http://codepen.io/bdougherty/pen/JgDfm" rel="nofollow">http://codepen.io/bdougherty/pen/JgDfm</a></p>
  
  <pre><code>$(function() {
      var iframe = $('#player1')[0];
      var player = $f(iframe);
      var status = $('.status');
  
      // When the player is ready, add listeners for pause, finish, and playProgress
      player.addEvent('ready', function() {
          status.text('ready');
  
          player.addEvent('pause', onPause);
          player.addEvent('finish', onFinish);
          player.addEvent('playProgress', onPlayProgress);
      });
  
      // Call the API when a button is pressed
      $('button').bind('click', function() {
          player.api($(this).text().toLowerCase());
      });
  
      function onPause() {
          status.text('paused');
      }
  
      function onFinish() {
          status.text('finished');
      }
  
      function onPlayProgress(data) {
          status.text(data.seconds + 's played');
      }
  });
  </code></pre>
  
  <pre class="lang-html prettyprint-override"><code>&lt;script src="https://f.vimeocdn.com/js/froogaloop2.min.js"&gt;&lt;/script&gt;
  &lt;iframe id="player1" src="https://player.vimeo.com/video/76979871?api=1&amp;player_id=player1" width="630" height="354" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen&gt;&lt;/iframe&gt;
  
  &lt;div&gt;
    &lt;button&gt;Play&lt;/button&gt;
    &lt;button&gt;Pause&lt;/button&gt;
    &lt;p&gt;Status: &lt;span class="status"&gt;&amp;hellip;&lt;/span&gt;&lt;/p&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Is there a workaround that I can use?</p>