Youtube Iframe API不适用于移动设备? [英] Youtube Iframe API not working for mobile devices?
问题描述
我很困惑.带有标准示例的Youtube Iframe API: https://developers.google.com/youtube/iframe_api_reference?hl = de 一直用于我的移动设备,现在不再可用.
I am confused. The Youtube Iframe API with the standard example: https://developers.google.com/youtube/iframe_api_reference?hl=de always used to work for my mobile devices and does not work anymore now..
我尝试过这种提琴: http://jsfiddle.net/77PJB/3/
<div id="player"></div>
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
var player;
function onYouTubeIframeAPIReady() {
player = new YT.Player('player', {
height: '250',
width: '444',
videoId: 'M7lc1UVf-VE',
events: {
'onReady': onPlayerReady
}
});
}
function onPlayerReady(event) {
event.target.playVideo();
}
使用iPad,iPhone和三星银河系.该视频无法播放.有什么变化吗?
with the iPad,iPhone and Samsung galaxy nexus. The video does not play.. Did something change?
谢谢
推荐答案
移动注意事项
自动播放和脚本播放
在某些移动浏览器(例如Chrome和Safari)中,HTML5元素仅在由用户交互(例如点击播放器)启动时才允许播放.这是Apple文档的摘录:
Mobile Considerations
Autoplay and Scripted Playback
The HTML5 element, in certain mobile browsers (such as Chrome and Safari), only allows playback to take place if it's initiated by a user interaction (such as tapping on the player). Here's an excerpt from Apple's documentation:
警告:为防止用户自费下载通过蜂窝网络进行的下载,嵌入式媒体无法在iOS的Safari中自动播放-用户始终启动播放."
"Warning: To prevent unsolicited downloads over cellular networks at the user’s expense, embedded media cannot be played automatically in Safari on iOS — the user always initiates playback."
由于这一限制,诸如autoplay,playVideo(),loadVideoById()之类的功能和参数在所有移动环境中均无法使用.
Due to this restriction, functions and parameters such as autoplay, playVideo(), loadVideoById() won't work in all mobile environments.
来自: https://developers.google.com/youtube/iframe_api_reference#Mobile_considerations
一种简单的解决方法,可自定义播放"按钮的外观:
A simple workaround to have a custom looks of the "play" button:
具有 pointer-events: none;
的叠加层元素. pointer-events
适用于所有现代移动浏览器,或者只需将视频容器放在按钮上并用opacity: 0
.
Have an overlay element with pointer-events: none;
. pointer-events
works on all modern mobile browsers or simply have the video container over the button with opacity: 0
.
这篇关于Youtube Iframe API不适用于移动设备?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!