尝试了一些事情,但无法使其正常工作。我有一个内联视频元素,我将其加载到颜色框中,然后将 mediaelementjs 应用到它。我在颜色框 onOpen 事件上触发了 mediaelement。
问题是当我关闭彩盒时电影继续播放。我无法在成功函数之外访问该播放器,例如在 onCleanup 或 onClose 中。
这是视频所在的html:
<div class="hidden">
<div id="trailer-wrap">
<video id="trailer" src="...video source..." type="video/mp4" controls="controls" width="720" height="480" preload="none">
<object width="720" height="405" type="application/x-shockwave-flash" data="path/to/flashmediaelement.swf">
<param name="movie" value="path/to/flashmediaelement.swf" />
<param name="flashvars" value="controls=true&file=...video source..." />
<img src="poster.jpg" alt="No video playback capabilities" />
</object>
</video>
</div>
</div>
这是它下面的脚本:
$(".cbox-trigger").colorbox({
inline:true,
innerWidth:"720px",
innerHeight:"480px",
scrolling:false,
onOpen: function(){
var player = new MediaElementPlayer('#trailer', {
success: function (mediaElement, domObject) {
// call the play method
mediaElement.play();
}
});
$.fn.colorbox.resize();
},
onCleanup: function(){
[how to access player object here?].pause();
}
});