mediaelement.js 中的 Flash 只显示“下载文件"; [英] Flash in mediaelement.js only shows "download file"
问题描述
我想让 mediaelement.js 的 Flash 回退工作正常工作,但它只在左上角显示一个黑色区域,上面写着下载文件".我生成的视频标记看起来非常像这样.我只是出于隐私原因修改了一些路径:
I would like to get the Flash fallback for mediaelement.js to work, but it only shows a black area saying "download file" in the upper left. The video markup I generate looks very much like this. I just modified some paths for privacy reasons:
<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 的调试工具中我看不到任何失败的请求.
Is there anything obviously wrong with this? Is there a way to get some debug output? When does the "download file" thing show up? The mediaelement.js page doesn't mention it anywhere. I first thought one of the paths must be wrong, but I can't see any failed requests in Chrome's debug tools.
感谢任何帮助!
我提取了失败代码的最小示例并将其上传这里
I extracted a minimal example of the failing code and uploaded it here
推荐答案
1) 您没有在视频中指定 - 这就是它不起作用的原因.您需要指定多个
<source/>
才能在不同的浏览器中工作 - 请参阅 http://mediaelementjs.com/ .
1) You didn't specify <source/>
inside video - that's why it doesn't work. You need to specify multiple <source/>
's for it to work in different browsers - see "Option B" at http://mediaelementjs.com/ .
下载文件"链接确实是由 MediaElement 逻辑生成的(参见 mediaelement-and-player.js:1027
).
"Download file" link is indeed generated by MediaElement logic (see mediaelement-and-player.js:1027
).
2) 只有当浏览器不支持 标签时,才会调用 Flash 回退.要在具有此功能的浏览器中对其进行测试,请替换<video>"带有无效标签 - 例如
2) Flash fallback will only be invoked if the browser doesn't support <video>
tag. To test it in a browser that does, replace "<video>" with an invalid tag - say, "<voodeo>".
这是固定代码(替换了一些路径以便能够测试它):
Here's the fixed code (replaced some paths to be able to test it):
<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 只显示“下载文件";的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!