Question

我在Mac OS X，10.7.5上的Firefox 22上的灯箱（精美盒子）中观看video.js和mp4（h.264）视频时遇到了很大问题。

点击“WILLKOMMEN BEI RANOVA”中间的播放按钮。

所有其他浏览器都像魅力一样，但FF给出了错误：“没有支持格式的视频和找到的MIME类型”，Firebug声明：“不支持给定的'type-Attribute''video / mp4'。加载媒体资源http://video-js.zencoder.com/oceans-clip.mp4失败。 “

以下是代码：

<script>

$(document).ready(function() {
$('#startplayer').fancybox(
{content : '<video class="video-js vjs-default-skin" controls preload="none" width="555"  height="311" poster="http://ranova.thull-hosting.de/fileadmin/videos/interview1_neu_vorschau.jpg"   data-setup="{}"><source src="http://video-js.zencoder.com/oceans-clip.mp4" type=\'video/mp4\'></source></video>'

}
);
});

//   $("#startplayer").fancybox({'padding':0,'margin':0,'width':640,'height':360,helpers:{title:{type:'inside'},overlay:{css:{'background':'rgba(0,0,0,0.5)'}}},'type':'swf','swf':{'wmode':'transparent','allowfullscreen':true}});

有人可以帮忙吗？

干杯 ANDI

Answer 1

Video.js没有在该页面上使用，所以你只有一个普通的视频元素，Firefox无法播放该文件。通过使用video.js，它的Flash后备将在Firefox上播放MP4。

在页面上包含video.js javascript和css

<link href="http://vjs.zencdn.net/4.1/video-js.css" rel="stylesheet">
<script src="http://vjs.zencdn.net/4.1/video.js"></script>

由于文档准备好后视频元素不存在，请使用Fancybox的onComplete选项创建video.js播放器。注意我给视频元素一个id来引用它。

$('#startplayer').fancybox(
  {content : '<video id="my_video" class="video-js vjs-default-skin" controls preload="none" width="555" height="311" poster="http://ranova.thull-hosting.de/fileadmin/videos/interview1_neu_vorschau.jpg"><source src="http://video-js.zencoder.com/oceans-clip.mp4" type=\'video/mp4\'></source></video>',
    onComplete: function() {
      videojs("my_video");
    }
  }
);

Video.js Firefox-22 Mac OS x fancybox

1 个答案: