JQuery JPlayer автозапуск не работает на Ipad, как показать элементы управления

Я использую 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).

Я не мог найти какой-либо вариант для этого в документе.

Может кто-нибудь помочь мне, какие изменения я должен сделать в коде, чтобы отобразить кнопку воспроизведения HTML5 на видео для jPlayer.

Спасибо за любую помощь.

4 ответа

Решение

nativeVideoControls это объект, содержащий несколько значений регулярных выражений, сопоставленных с пользовательским агентом браузера. добавьте это к вашим опциям. вот несколько примеров.

nativeVideoControls: {
  ipad: /ipad/,
  iphone: /iphone/,
  android: /android/,
  blackberry: /blackberry/,
  iemobile: /iemobile/
},

Вы не сможете воспроизводить видео из $(document).ready() или из события готовности jPlayer. IOS специально предотвращает это:

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

Хорошая новость заключается в том, что вы можете играть столько, сколько захотите, после загрузки страницы, когда пользователь нажимает на что-нибудь. Если страница, содержащая ваше видео, не является первой страницей, на которую пользователь попадет на ваш сайт, вы можете просто добавить это видео в скрытый раздел на предыдущей странице. Когда пользователь нажимает кнопку, вместо того, чтобы автоматически воспроизводить видео на новой странице, показывайте скрытый элемент div и воспроизводите его там.

Если вам просто нужно найти способ воспроизвести его для определенных пользователей, вы можете использовать другой браузер. Например, веб-браузер iSwifter Flash переводит jPlayer в режим swf и выполняет автозапуск. Но у него есть и другие причудливые поведения, которые, похоже, нацелены на флеш-геймеров.

Если вам нужно играть в Safari и большинстве других альтернативных браузеров IOS, вам придется немного изменить рабочий процесс.

Я использовал следующий подход, чтобы показать элементы управления видео только на Ipad

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

Вам нужно инициализировать 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);
Другие вопросы по тегам