Question

我已将HTML5视频添加到我正在处理的网站上。一切正常，除非它只在Apple机器上的firefox上播放，它在所有其他浏览器上运行良好，即使在Windows和Windows上使用Firefox也是如此。 Linux操作系统。

我做过的一件事就是从视频中删除控件并添加一个播放按钮的图像，供用户点击播放视频＆amp;关闭/停止视频的关闭按钮的图像。

任何想法可能导致这种情况，我认为这可能是一个特定于浏览器的问题，它不允许视频在没有控件的情况下播放，但这是我们真正想要的效果。

HTML 5

<div id="video-wrapper" style="z-index: 210; background-color: rgb(0, 0, 0);">
    <div align="center">
        <video id="hp-video-player" preload="auto" poster="/wp-content/uploads/Homepage_arival_preview.jpg" style="display: inline-block;">
        <source type="video/mp4" src="/wp-content/uploads/Homepage_Movie.mp4"><source type="video/webm" src="/wp-content/uploads/Homepage_Movie.webm"><object width="1900" height="1060" type="application/x-shockwave-flash" data="http://development.com/wp-content/themes/jupiter/js/flashmediaelement.swf"></object><param name="movie" value="http://development.com/wp-content/themes/jupiter/js/flashmediaelement.swf"><param name="flashvars" value="controls=true&amp;file=/wp-content/uploads/Homepage_Movie.mp4"><img src="/wp-content/uploads/Homepage_arival_preview.jpg" title="No video playback capabilities"></video>
        <img id="video-close-btn" src="http://development.com/wp-content/themes/jupiter-child/images/x-close-menu.png" style="display: inline;">
        <div align="center"><img id="hp-play-btn" src="http://development.com/wp-content/themes/jupiter-child/images/play_button.png" style="display: none;"></div>
    </div>
</div>

JS

var video = jQuery("#hp-video-player").get(0);

jQuery("#hp-play-btn").click(function() {  // Play button Click Actions
    video.play();
    jQuery("#hp-video-player, #video-close-btn").fadeIn(300);
    jQuery(this).fadeOut(500);
    jQuery("#video-wrapper").css({'background-color' : '#000000', 'z-index' : '210'});
}

jQuery("#video-close-btn").click(function(){ // Close button Click Actions
  video.pause();
  jQuery("#hp-video-player, #video-close-btn").fadeOut(500);
  jQuery("#hp-play-btn").fadeIn(300);
  jQuery("#video-wrapper").css({'background-color' : 'transparent', 'z-index' : '65'});
});

Answer 1

OSX上的Firefox桌面上不支持H264 / MP4。

设定eh Supported Formats文章和/或the bug旨在实施该文章。

html5视频无法在Apple机器上的Firefox中播放

1 个答案: