2

我正在使用 jPlayer 在网页上播放视频,以使其与桌面浏览器和 iPad 兼容。

我正在使用以下代码

$("#jquery_videoPlayer").jPlayer({
    ready: function () {
        $(this).jPlayer("setMedia", {
            m4v: _mp4url,
            ogv: _oggurl,
            webmv: _webmurl,
            flv:_url
        }).jPlayer("play");
    },
    swfPath: "../js",
    supplied: "m4v, webmv, ogv, flv",
    preload:"auto",
    loop:true,
    solution: "html, flash",
    size: {
        width: "256px",
        height: "240px"
    }
});

它在所有浏览器上都可以正常工作,但是由于 iPad 不允许自动播放视频,因此我需要在视频 (HTML5) 上显示播放按钮。

我在文档中找不到任何选项。

有人可以帮助我在代码中进行哪些更改以在 jPlayer 的视频上显示 HTML5 播放按钮。

谢谢你的帮助。

4

4 回答 4

2

您将无法从 $(document).ready() 或 jPlayer 的 ready 事件中播放视频。IOS专门防止它:

http://roblaplaca.com/blog/2010/04/14/ipad-and-iphone-html5-video-autoplay/

好消息是,在页面加载完毕并且用户确实点击了某些内容后,您可以随意播放。如果包含您的视频的页面不是用户将在您的网站上点击的第一页,那么您可以将此视频添加到上一页中的隐藏 div 中。当用户单击时,不是在新页面上自动播放视频,而是显示隐藏的 div 并在那里播放。

如果您只需要为特定用户找到一种播放方式,您可以使用不同的浏览器。例如,iSwifter Flash 网络浏览器将 jPlayer 置于 swf 模式,并自动播放。但它还有其他一些似乎是针对 Flash 游戏玩家的古怪行为。

如果您需要它在 safari 和大多数其他替代 IOS 浏览器上播放,那么您需要稍微改变您的工作流程。

于 2012-06-08T14:18:39.940 回答
1

我使用以下方法仅在 ipad 上显示视频控件

var platformInfo = uaPlatform(navigator.userAgent); if(platformInfo.platform.toLowerCase() == "ipad" || platformInfo.tablet.toLowerCase() == "ipad") { $("#jquery_videoPlayer").jPlayer("option", "nativeVideoControls", {all : /./}); }

于 2012-06-13T05:21:08.737 回答
1

您需要在单击或触摸事件上初始化 jPlayer。

// Note on the iPad you may want to use "touchstart" instead.
$('.play-button').on('click', function() {
    jplayer = $("#jplayer").jPlayer({
      swfPath: "http://f.ordify.net/assets/Jplayer.swf",
      ready: function () {
        $(this).jPlayer("setMedia", {
          mp3: "http://f.ordify.net/audio/alarm.mp3"
          });
      },
      solution: "html, flash",
      supplied: "mp3",
      preload: "auto"
    });
  }
})
setTimeout(function() { jplayer.jPlayer("play"); }, 5000);
于 2012-10-09T19:37:43.857 回答
1

nativeVideoControls是一个包含多个正则表达式值的对象,与浏览器的用户代理匹配。将此添加到您的选项中。这里有些例子。

nativeVideoControls: {
  ipad: /ipad/,
  iphone: /iphone/,
  android: /android/,
  blackberry: /blackberry/,
  iemobile: /iemobile/
},
于 2013-10-31T23:44:22.843 回答