YouTube iframe ломается с масштабом webkit () на iPad Mobile Safari - PullRequest
2 голосов
/ 22 февраля 2012

Пример ниже загружает клип YouTube и масштабирует его до 50% в течение 2 секунд.При запуске на iPad миниатюра дрожит и масштабируется слишком мало в конце анимации.

Почему это происходит?

(Пример также доступен на http://pastehtml.com/view/boy9rz76w.html):

<html>
  <body>
    <!-- 1. The <iframe> (and video player) will replace this <div> tag. -->
    <div id="player"></div>

    <script>
      var tag = document.createElement('script');
      tag.src = "http://www.youtube.com/player_api";
      var firstScriptTag = document.getElementsByTagName('script')[0];
      firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

      var player;
      function onYouTubePlayerAPIReady() {
        player = new YT.Player('player', {
          height: '390',
          width: '640',
          videoId: 'u1zgFlCw8Aw',
          events: {
            'onReady': onPlayerReady,
            'onStateChange': onPlayerStateChange
          }
        });
      }

      // 4. The API will call this function when the video player is ready.
      function onPlayerReady(event) {
          Player = document.getElementById("player");
          Player.style["-webkit-transition"] = "all 2s ease-in-out";
          Player.style["-webkit-transform"] = "scale(0.5)";
      }

      function onPlayerStateChange(event) {

      }
    </script>
  </body>
</html>
...