在CreateJS中加载视频的最简单方法?

时间:2015-03-08 14:16:48

标签: javascript canvas html5-canvas easeljs createjs

我希望通过CreateJS(Flash CC)加载视频,mp4或ogg格式。最简单的方法是什么?那里几乎没有文件。我知道视频可以作为位图上传,例如:

 var bitmap = new createjs.Bitmap("moviePath.mp4");

当我以这种方式加载视频时,我可以听到播放的音频,但实际上无法在画布上看到视频。我怀疑这是因为画布不是绘制每个单独的帧,尽管放置了自动收报机功能和stage.update()

感谢任何帮助!

2 个答案:

答案 0 :(得分:2)

我认为您应该使用DOMelement。假设您正在使用jQuery,您可以尝试这样的事情:

var videoDom = $('<video width="320" height="240" autoplay><source src="movie.mp4" type="video/mp4"></video>').appendTo(document.body)[0];
var cjsVideo = new createjs.DOMElement(videoDom);
stage.addChild(cjsVideo);

答案 1 :(得分:0)

您可以像往常一样将它们放在DOM中,并通过CSS display:none

隐藏它们
<video class="js-video" preload="auto" autoplay style="display:none;">
<source src="/videos/video.mp4" type="video/mp4">
<source src="/videos/video.webm" type="video/webm">
</video>

之后只需通过jQuery(或原生JS)选择它并将其传递给Bitmap实例。

var bitmap = new createjs.Bitmap($('.js-video')[0]);

如果您未对视频应用任何屏蔽/过滤器等,则最好使用上面提到的普通DOMElement。