没有全屏的Iphone上的YouTube Iframe API

时间:2016-03-16 18:14:12

标签: javascript ios iphone youtube-iframe-api

我有一个网络应用程序,它使用YouTube Iframe API将歌词和和弦与YouTube歌曲同步。对于我们来说,嵌入式视频在没有全屏的情况下进行内联播放至关重要。否则用户无法看到页面上的歌词和和弦,应用程序将毫无意义。

这是demo

我们从iphone获得了50%的流量,但是iphone播放的YouTube视频总是全屏显示。

以下是嵌入视频的代码

var player;

function onYouTubeIframeAPIReady() {
  player = new YT.Player('player', {
    height: '390',
    width: '640',
    videoId: $("#ytid").attr("value"),
    playerVars: {'theme':'light','color':'white','modestbranding':1,'rel':0},
    events: {
      'onReady': onPlayerReady,
      'onStateChange': onPlayerStateChange
    }
  });

在网络上寻找解决方案,我们尝试了一些修复,但它们都不适用于iPhone。如果我们相信它可行,我们也准备开发Swift应用程序。然而,网络搜索也表明相反。

  1. 是否有可靠的解决方法来内联播放YouTube Iframe API视频?
  2. 我们可以通过开发本地IOS应用程序来解决我们的问题吗?

2 个答案:

答案 0 :(得分:7)

将参数'playsinline':'1'添加到playerVars为我工作。我不知道这对于web是否也是如此,我正在使用React Native应用程序中的WebView。

var player;

function onYouTubeIframeAPIReady() {
    player = new YT.Player('player', {
    height: '390',
    width: '640',
    videoId: $("#ytid").attr("value"),
    playerVars: {'playsinline':'1', 'theme':'light','color':'white','modestbranding':1,'rel':0},
    events: {
        'onReady': onPlayerReady,
        'onStateChange': onPlayerStateChange
    }
});

答案 1 :(得分:0)

从广义上讲:不,iPhone上的Safari总是会全屏播放视频

iPad 支持支持内嵌视频播放。

如果你有自己的iOS应用程序,显然你可以更好地控制视频播放。看看你的网站,拥有一个应用程序肯定会让你更好地控制自动滚动等,因为它确实打开了一个全世界的能力(和复杂性!)。