[摘要]下面给大家看几个案列，都是一些问题案列和总结，值得大家参考和研究，因为我用canvas绘制了video，发现效果和直接用video一样。因此还是用了原来video的方式<div class=&...
下面给大家看几个案列，都是一些问题案列和总结，值得大家参考和研究，因为我用canvas绘制了video，发现效果和直接用video一样。因此还是用了原来video的方式
<div class="commondw videoimg" id="videoimg"></div><video class="vido" id="vidoid" poster="images/photo/video.jpg">
<source src="media/move.mp4" type="video/mp4"></video>$("#videoimg").on("click", function () {
$(this).fadeOut(1000);
$(".clicktips").hide();
$("#vidoid").show();
$("#vidoid")[0].play();
$("#vidoid").bind('ended', function () {
$("#vidoid").hide();
$("#videoimg").show();
})
});但是浏览器中还是没有问题的，和canvas绘制一样！点击体验原生video版障眼法视频
失败案例二（canvas渲染video）
后来我想到用canvas渲染video，也就是通过canvas的drawImage方式,结合requestAnimationFrame动画，requestAnimationFrame动画我之前制作婚礼邀请函总结的时候也介绍过。
下面贴出代码
function VideoToCanvas(videoElement,fn) {
if (!videoElement) {
return;
}
var fn=fn 关键词：移动端video视频播放的问题案例总结