之前曾经介绍过，在HTML5中可以通过
{drawImage}
画布canvas如何与视频video标签结合，达到制作各种视频功能的效果呢？其秘诀在于通过画布重新描绘一次视频的内容，将视频的每个画面都转换成画布的图像，这样就可以通过javascript语言所提供的图像控制方法来操控它们。所以炫酷播放器所使用的视频功能，并不针对video，而是针对描绘出影像的canvas。
能够描绘影像到画布中的方法是“drawImage"，此方法允许在canvas中插入画布（canvas），图像（img）和视频（video）等元素。
drawImage方法
有三种：drawImage（image，dx，dy）//原比例绘制图像 drawImage（image，dx，dy，dw，dh）//按设置长宽绘制图像 drawImage（image，sx，sy，sw，sh，dx，dy，dw，dh）//裁切后绘制图像
canvas{
border:1px solid black;
}
Image:
Canvas:
Canvas: