Скрытый игрок на YouTube теряет свои методы - PullRequest
5 голосов
/ 04 февраля 2010

Я управляю встроенным плеером YouTube без хрома с помощью javascript и хочу время от времени скрывать его, установив display: none. Однако, когда я снова показываю плеер, он теряет методы YouTube.

Например:

<script>
  swfobject.embedSWF("http://www.youtube.com/apiplayer?enablejsapi=1&playerapiid=player",
    "player", "425", "356", "8", null, null, 
    {allowScriptAccess: "always"}, {id: 'player'}
  );

  var player = null;

  function onYouTubePlayerReady(playerId) {
    player = document.getElementById(playerId);
    player.addEventListener('onStateChange', 'playerStateChanged');
  }

  function hidePlayer() {
    player.pauseVideo();
    player.style.display = 'none';
  }
  function showPlayer() {
    player.style.display = 'block';
    player.playVideo();
  }
</script>
<a href="#" onClick="hidePlayer();">hide</a>
<a href="#" onClick="showPlayer();">show</a>
<div id="player"></div>

Вызов hidePlayer с последующим showPlayer выдает эту ошибку при вызове playVideo:

Uncaught TypeError: Object #<an HTMLObjectElement> has no method 'playVideo'

Единственное решение, которое я могу найти, это использовать видимость: скрытый, но это портит мой макет страницы. Есть ли другие решения?

Ответы [ 2 ]

0 голосов
/ 24 марта 2013

Оба отображения: нет и видимость: скрытый перезагрузит плеер, но вы можете решить это с помощью CSS, обернув видеопроигрыватель в div с переполнением: скрытое.

HTML:

<div id="ytwrapper">
    <div id="ytplayer">
    </div>
</div>

CSS:

#ytwrapper { overflow: hidden; }

JS:

function hidePlayer() {
    player.pauseVideo();
    player.style.marginLeft = "50000px";
}

function showPlayer() {
    player.style.marginLeft = "0px";
    player.playVideo();
}
0 голосов
/ 10 февраля 2010

У меня такое было и со мной в моем скрипте пользователя.Вы можете попробовать сделать его размером 1x1 px, а не скрывать его целиком.

Это довольно раздражающая проблема, и нет смысла объяснять, почему это происходит.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...