我想让Flash回退以使mediaelement.js正常工作,但它仅在左上方显示一个黑色区域,上面显示“下载文件”。
我生成的视频标记看起来非常像这样。出于隐私原因,我刚刚修改了一些路径:
<video width="1024" height="576" preload="none" style="display: none; ">
<object width="1024" height="576" type="application/x-shockwave-flash" data="flashmediaelement.swf">
<param name="movie" value="/wp-content/themes/my_theme/js/vendor/mediaelement/flashmediaelement.swf">
<param name="flashvars" value="controls=true&file=http://mybucket.s3.amazonaws.com/my_video.mp4">
</object>
</video>
这显然有什么问题吗?有没有办法得到一些调试输出?什么时候出现“下载文件”内容? mediaelement.js页面没有任何地方提及它。
我首先认为其中一个路径一定是错误的,但是我无法在Chrome的调试工具中看到任何失败的请求。
任何帮助表示赞赏!
编辑:
我提取了一个失败代码的最小示例,并将其上传为here
最佳答案
1)您未在视频中指定<source/>
-这就是为什么它不起作用的原因。您需要指定多个<source/>
才能在不同的浏览器中运行-请参见http://mediaelementjs.com/上的“选项B”。
实际上,“下载文件”链接是由MediaElement逻辑生成的(请参阅mediaelement-and-player.js:1027
)。
2)仅当浏览器不支持<video>
标记时,才会调用Flash后备广告。要在运行该功能的浏览器中对其进行测试,请使用无效的标记(例如“”)替换“”。
这是固定的代码(替换了一些路径以对其进行测试):
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="http://ajmurmann.com/flash_test/mediaelement-and-player.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('video').mediaelementplayer({
enablePluginDebug: true,
plugins: ['flash','silverlight']
});
});
</script>
</head>
<body>
<video width="1024" height="576" controls="controls">
<!-- MP4 for Safari, IE9, iPhone, iPad, Android, and Windows Phone 7 -->
<source type="video/mp4" src="http://mediaelementjs.com/media/echo-hereweare.mp4" />
<!-- WebM/VP8 for Firefox4, Opera, and Chrome -->
<source type="video/webm" src="http://mediaelementjs.com/media/echo-hereweare.webm" />
<!-- Ogg/Vorbis for older Firefox and Opera versions -->
<source type="video/ogg" src="http://mediaelementjs.com/media/echo-hereweare.ogv" />
<object width="1024" height="576" type="application/x-shockwave-flash" data="http://ajmurmann.com/flash_test/flashmediaelement.swf">
<param name="movie" value="http://ajmurmann.com/flash_test/flashmediaelement.swf">
<param name="flashvars" value="controls=true&file=http://ajmurmann.com/flash_test/echo-hereweare.mp4">
</object>
</video>
</body>
</html>
关于mediaelement.js中的Flash仅显示 "download file",我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/9450870/