Need Solution With Identical Results To Flash - HTML 5 Compliant

I used to build sites that used flash for background animations & background movies while having regular (selectable) Html text on top.

Flash really fit the bill because it allowed for streaming movies WITHIN the animation itself, so you could layer things really well and get a very creative website going.

BUT FLASH IS DYING...

So I'm here to ask you good folks what solution (or solutions) should I look towards that can accomplish the same goals in modern non-Flash platforms (web-mobile etc).

It would need to:

Create animations that can have within them movie files. I would need to control the movies from the animation, not just slap them as background

NOTE: I have looked at all kinds of plugins etc for putting a movie as a site background, but this would NOT yield the result I need as it is just a movie playing and cannot be scripted as an animation in Flash was. I also checked out Adobe Edge. It comes closest to what I need but I have found no way of working with video inside it the same as in Flash - Please correct me if I'm wrong.

I'm no Javascript maestro by any means. I would dive deeper into it but I'm not sure it would work for what I need.

I hope I have not confused you with this long winded question and I thank you for your help.

Solution

Try the html canvas element. You can pipe video to the canvas using a hidden video element and any animation you can think of is possible through canvas. Since these are dom elements, you can of course put other HTML on top of them.

For good canvas frameworks check: http://www.backslash.gr/content/blog/webdevelopment/7-10-javascript-canvas-frameworks

I'm personally a big fan of paper.js and processing.js