VideoJs与火狐回退的问题 [英] Issue with the flash fallback of VideoJs with Firefox

查看:290
本文介绍了VideoJs与火狐回退的问题的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我已经尝试添加videoJs到我的网站来播放MP4文件,所有的作品在Chrome中都完美的运行,但是当我去火狐浏览器(不支持MP4文件)时,Flash播放器停留在黑屏上,按钮什么也不做。

简单的问题:为什么?
我不明白,像vine.co或Instagram的网站使用videoJs没有问题,但对我来说,情况并非如此。



所以我试图改变技术秩序,现在Flash总是尝试阅读视频,但即使在铬没有追加。



这是我的测试代码:

 <!DOCTYPE html> 
< html>
< head>
< title> test< / title>

< script type ='text / javascript'src ='https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js'><< ; /脚本>
< script src =http://vjs.zencdn.net/4.0/video.js>< / script>
< script>
videojs.options.flash.swf =video-js.swf
< / script>
< / head>
< body>
< video id =videosrc =http://domain.com/flash/video.mp4control>< / video>
< script type =text / javascript>
jQuery(function(){
var player = videojs('video',{controls:true,autoplay:false,preload:auto,techOrder:[ flash,html5]});
console.log(player);
});
< / script>
< / body>
< / html>所有的文件(SWF播放器,MP4视频和HTML文件)都在相同的位置(
$ / code>

文件夹名为flash。



您能帮我吗?

解决方案

在这里尝试几件事:


  1. 确保您正在加载video-js css文件。 b
  2. 将video-js和skin类添加到视频对象中(这也是controls,而不是control): https://github.com/videojs/video.js/blob/0020ba15b9ae2b60e51d4d8d2751ffa31d18694d/docs/guides/setup.md a>

  3. 如果您从CDN加载视频js,则无需设置flash.swf选项。这可能会导致一个问题。

您不需要设置techOrder让Firefox运行,不需要每种类型的技术的相应的视频文件。 Flash只会在mp4以上版本播放。



我在Firefox上遇到了一个问题,Flash后备播放视频,但是当我包括一个就绪事件时,视频将是空白的(音频会播放)。我可以通过在$(this)对象上发射blur事件来解决这个问题。如果您需要使用ready,这可能对您有所帮助。


I have try to add videoJs to my site to play MP4 files, all works perfectly in Chrome but when I go to Firefox (which doesn't support MP4 files) the flash player stay on a black screen and buttons do nothing.

Simple question: why? I don't understand, websites like vine.co or instagram use videoJs with no issue but for me this is not the case.

So I tried to change the tech order, now Flash always try to read the video but even on chrome nothing append.

This is my test code:

<!DOCTYPE html>
<html>
<head>
    <title>test</title>

    <script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js'></script>
    <script src="http://vjs.zencdn.net/4.0/video.js"></script>
    <script>
      videojs.options.flash.swf = "video-js.swf"
    </script>
</head>
<body>
    <video id="video" src="http://domain.com/flash/video.mp4" control></video>
    <script type="text/javascript">
        jQuery(function() {
            var player = videojs('video', {"controls": true, "autoplay": false, "preload": "auto", "techOrder": ["flash", "html5"]});
            console.log(player);
        });
    </script>
</body>
</html>

All the files (the swf player, the MP4 video, and the html file) are in the same folder named 'flash'.

Can you help me?

解决方案

A few things to try here:

  1. Make sure you're loading the video-js css file.
  2. Add the "video-js" and skin classes to your video object as described here (also, it is "controls", not "control"): https://github.com/videojs/video.js/blob/0020ba15b9ae2b60e51d4d8d2751ffa31d18694d/docs/guides/setup.md
  3. If you're loading video js from the CDN, you don't need to set the flash.swf option. That may be causing an issue as well.

You shouldn't need to set the techOrder to get Firefox to behave, and you definitely don't need a corresponding video file for each type of "Tech". Flash will play the fallback in mp4 as long as it's above version 9 or so.

I did run into an issue on Firefox where the Flash fallback would play the video but the video would be blank (audio would play) when I included a "ready" event. I was able to get around this by firing a blur event on the $(this) object. That may be helpful to you if you need to use ready.

这篇关于VideoJs与火狐回退的问题的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆