Easiest way to load a video in CreateJS?

问题

I'm looking to load a video via CreateJS (Flash CC), either mp4 or ogg format. What is the easiest way to do this? There is almost no documentation out there. I know videos can be uploaded as a bitmap, eg:

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

When I load a video in this way, I can hear the audio playing, but can't actually see the video on the canvas. I suspect this is because the canvas isn't drawing each individual frame, despite putting ticker functions and stage.update()

Any help is appreciated!

回答1:

I think you should use the DOMelement for this. Assuming you're using jQuery you could try something like this:

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);

回答2:

You could place them as usual in the DOM and hide them via 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>

Afterwards just select it via jQuery (or native JS) and pass it to the Bitmap instance.

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

If you won't apply any masking/filter etc. to the video it might be better to use the normal DOMElement as metioned above.

来源：https://stackoverflow.com/questions/28927434/easiest-way-to-load-a-video-in-createjs

标签

javascript