хотите отобразить кнопку воспроизведения YouTube для ios и не можете

Я использую javascript API iframe для YouTube, и мои видео не воспроизводятся в ios7. Я заметил, что в iframe есть кнопка воспроизведения, которая скрыта собственными таблицами стилей YouTube (точнее, установлена ​​​​на высоту и ширину 1 пиксель! важно). Если я использую отладчик сафари с симулятором ios7 для удаления этих стилей, кнопка воспроизведения становится видимой и при нажатии позволяет воспроизводить видео в ios.

Проблема в том, что я не могу написать стиль в своих таблицах стилей, который переопределяет это поведение! Как я могу решить эту проблему? Прикреплен скриншот оскорбительного стиля, а ниже мой код для запуска плеера:

var videoOptions = {
        'controls': 0,
        'playsinline' : 1,
        'showinfo': 0,
        'html5':1,
        'modestbranding': 1,
        'autoplay': 0,
        'rel': 0,
        'enablejsapi' : 1,
        //'origin': window.location.origin,
        'wmode': 'opaque'
      };
      $scope.jsPlayer = new YT.Player('story-video-player-container', {
        height: '100%',
        width: '100%',

        videoId: $scope.currentVideo.youtube_id,
        events: {
              'onReady': $scope.onPlayerReady,
              'onStateChange': $scope.onPlayerStateChange,
              'onPlaybackQualityChange': $scope.onPlaybackQualityChange
        },
        playerVars: videoOptions,
      });

Я пытался изменить все параметры видео, чтобы показать все элементы управления/информацию/брендинг/и т. д., ничего не работает.

введите здесь описание изображения


person mheavers    schedule 21.03.2014    source источник


Ответы (1)


Это известная проблема, которую Google называет "исправленной", но другие разработчики (включая нас) утверждают, что это не так. Я сослался на ваш вопрос там. Вы можете следовать этому, но сообщайте и добавляйте свой голос в обсуждение.

На данный момент кажется, что это полностью контролируется со стороны Youtube, потому что он устанавливает размер тега видео внутри html5-video-container равным 1px.

В нашем случае у нас есть iframe, встроенный в страницу, а затем кнопка, которая запускает javascript для отображения скрытого элемента div, чтобы появилось видео, а также запускает событие воспроизведения YouTube API для воспроизведения видео (пример: http://www.3708colet.com).

Но Google говорит, что это то же самое, что и «автовоспроизведение», и оно отключено в iOS (очевидно, что оно также отключено в Android Chrome — в наших тестах он тоже не работает). Вместо воспроизведения, по крайней мере, в iOS, он показывает белый квадрат размером 1 пиксель в верхнем левом углу нашего контейнера, где находится iframe. И если мы нажмем на нее, это вызовет «взаимодействие» с видео и загрузит видео (не работает для Android). Таким образом, ошибок нет, но страница YouTube просто не делает это видео достаточно большим, чтобы заполнить область iframe.

person Chadwick Meyer    schedule 19.05.2014