An example of HTML5 canvas video zoom

Share RGraph:   
Posted on 20th July 2013

Summary
This page shows you an example of how you can use HTML5 canvas to show a video and select a portion of it to zoom in on

Note: The video doesn't play in Safari - it doesn't seem to like canvas based video - use a different browser for this demo (eg Chrome).

[No canvas support] [No canvas support]

This is a demo of HTML5 video in conjunction with two canvas tags to produce a zoom effect. You can select an area of the left video and that area will be zoomed in on on the right canvas.

To get the source you can view the source of the page. Everything is contained within the window.onload function - and its commented.

Comments

Add a new comment...