今天小编跟大家讲解下有关html5播放视频且动态截图实现步骤与代码(支持safari其他未测试) ，相信小伙伴们对这个话题应该有所关注吧，小编也收集到了有关html5播放视频且动态截图实现步骤与代码(支持safari其他未测试) 的相关资料，希望小伙伴们看了有所帮助。
暂不支持chrom 。支持safari .其他未测试 先引用 jquery 地址。选用新浪的 复制代码代码如下: <script type="text/javascript"src="http://lib.sinaapp.com/js/jquery/1.6/jquery.js"></script> 加一个video标签 复制代码代码如下: <video id="video"controls="controls"> <source src="https://www.aidi.net.cn//html5/1.mp4"/> </video> 然后js 复制代码代码如下: <script type="text/javascript"> $().ready(function(){ var video, output; var scale = 0.25; var initialize = function() { output = $("#output"); video = $("#video").get(0); $("#capture").click(captureImage); }; var captureImage = function() { var canvas = document.createElement("canvas"); canvas.width = video.videoWidth * scale; canvas.height = video.videoHeight * scale; canvas.getContext('2d') .drawImage(video, 0, 0, canvas.width, canvas.height); var img = document.createElement("img"); img.src = canvas.toDataURL(); output.prepend(img); }; $(initialize); }); </script> 效果图就不贴了。来源：爱蒂网
