video + canvas = magic
BRANK

You’ve already learned about the <video> and <canvas> elements, but did you know that they were designed to be used together? In fact, the two elements are absolutely wondrous when you combine them! I’m going to show off a few super-simple demos using these two elements, which I hope will prompt cool future projects from you fellow web authors. (All of these demos work in every modern browser except Internet Explorer.)First, the basicsIf you’re just starting with HTML5, you may not be familiar with the <video> element and how to use it. Here’s a simple example that we’ll be using in the later demos:<video controls loop> <source src=video.webm type=video/webm> <source src=video.ogg type=video/ogg> <source src=video.mp4 type=video/mp4> </video> The <video> element contains two attributes: @controls and @loop. @controls tells the browser to give the video the standard set of video controls: play/pause, scrubber, volume, etc. @loop tells the browser to start the video ove…

html5doctor.com
Related Topics: CSS IE / Microsoft Edge HTML5