问题描述
我在使用javascript控制quicktime电影时遇到了问题。我正在使用< video>
HTML5元素在我的HTML页面中嵌入视频 - 如果浏览器不支持它,则回退到quicktime(例如IE 8)(我有无闪光的特定要求,但允许快速时间)。视频以弹出方式显示;当弹出窗口关闭时,我想停止视频播放。我可以在HTML5中成功完成此操作,但是quicktime控件无效。
I've got a problem controlling a quicktime movie from javascript. I am embedding a video in my HTML page using <video>
HTML5 element - with fallback to quicktime if the browser doesn't support it (e.g. IE 8) (I have a specific requirement of "no flash", but quicktime is allowed). The video is displayed in a popup; when the popup is being closed, I want to stop video playback. I can do this successfully in HTML5, but the quicktime control is not working.
我的html看起来像这样:
My html looks like this:
<video width="360" height="298" autobuffer="autobuffer" controls="controls" id="video" tabindex="0">
<source type="video/mp4; codecs="avc1.42E01E, mp4a.40.2"" src="/data/mmg-demo.mp4"></source>
<source type="video/ogg" src="/data/mmg-demo.ogv"></source>
<object width="360" height="298" id="videoem" codebase="http://www.apple.com/qtactivex/qtplugin.cab" classid="clsid:02bf25d5-8c17-4b23-bc80-d3488abddc6b">
<param value="/data/mmg-demo.mp4" name="src">
<param value="false" name="autoplay">
<param value="true" name="controller">
<embed width="360" height="298" name="videoem" pluginspage="http://www.apple.com/quicktime/download/" loop="false" controller="true" autoplay="false" src="../files/380/380523/video.mp4">
</object>
</video>
弹出关闭javascript函数如下所示:
The pop-up close javascript function looks like this:
function closePopup {
//stop html5 playback if it's there
if(typeof document.getElementById('video').pause == 'function') {
document.getElementById('video').pause();
}
//stop playback of quicktime embed if it's there
if(document.getElementById('videoem')) {
document.getElementById('videoem').SetRate(0.0);
}
$('#demo-video').fadeOut();
}
我在firefox中测试了这个完全相同的quicktime代码 - 它工作正常。此外,声称可以工作的其他论坛中的示例在IE 8中不起作用(例如,参见 - 在IE 8中不起作用。)
I've tested this exact same quicktime code in firefox - and it works fine. Moreover, examples in other forums that claim to work, do not work in IE 8 (e.g. see http://lists.apple.com/archives/quicktime-api/2008/Mar/msg00187.html - does not work in IE 8).
行 document.getElementById('videoem')。SetRate(0.0)
原因对象不支持此属性或方法
错误。
我不知道还能在哪里看。非常感谢任何帮助。
I'm not sure where else to look. Any help is greatly appreciated.
推荐答案
好的,我想我已经明白了。诀窍是使用< embed>
元素中的ID而不是< object>
元素。所以我得到的最终(工作)代码就是这样。
Ok, I think I figured it out. The trick is to use the ID from the <embed>
element and not the <object>
element. So the final (working) code I got is this.
HTML:
<div id="mkt-video" style="position:fixed;width:360px;background-color:black;padding:10px;border:solid 2px white;display:none;z-index:100003">
<video id="video" width="360" height="298" controls="controls" autobuffer="autobuffer">
<source src="/data/mmg-demo.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' />
<source src="/data/mmg-demo.ogv" type="video/ogg" />
<object classid='clsid:02bf25d5-8c17-4b23-bc80-d3488abddc6b' width="360" height="298" codebase='http://www.apple.com/qtactivex/qtplugin.cab' id="videoem-object">
<param name='src' value="/data/mmg-demo.mp4" />
<param name='autoplay' value="false" />
<param name='controller' value="true" />
<param name="enablejavascript" value="true" />
<embed src="../files/380/380523/video.mp4" width="360" height="298" autoplay="false" controller="true" loop="false" pluginspage='http://www.apple.com/quicktime/download/' name="videoem" id="videoem"></embed>
</object>
</video>
</div>
和Javascript:
And Javascript:
function closeVideo() {
if(typeof document.getElementById('video').pause == 'function') {
document.getElementById('video').pause();
}
try {
document.getElementById('videoem-object').SetRate(0.0);
}
catch (err) {}
$('#mkt-video').fadeOut();
}
try-catch是必需的,因为IE9仍然会创建嵌入对象但是有些奇怪的类型并且会抛出一些奇怪内容的错误。无论如何,它现在工作正常。
The "try-catch" is required, because IE9 still creates the embed object but of some strange type and throws errors of some strange content. Anyway, it works fine now.
这篇关于从javascript控制quicktime电影在IE中不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!