1. 爱易网页
  2. JavaSript
  3. 求大神指导，怎么对网页视频播放器进行画面截取

求大神指导，怎么对网页视频播放器进行画面截取

日期：2014-05-16　 浏览次数：20383 次

求大神指导，如何对网页视频播放器进行画面截取~
我想在视频后方添加按钮对视频画面进行点击截取，截取后的图片保存在网页视频后方，图片点击右键可对其保存为jpeg格式。
<!DOCTYPE HTML>
<html>
<head>
<title>Video test</title>
<script src="jquery-1.10.2.js"></script>
</head>
<body>

<object id="video1" width="1024" height="768" border="0" classid="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA">

　　<param name="ShowDisplay" value="0">

　　<paramname="ShowControls" value="1">

　　<param name="AutoStart" value="1">

　　<param name="AutoRewind" value="0">

　　<param name="PlayCount" value="0">

　　<param name="Appearancevalue="0" value="">

　　<param name="BorderStylevalue="0" value="">

　　<param name="MovieWindowHeight" value="768">

　　<param name="MovieWindowWidth" value="1024">

　　<param name="FileName" value="/AC.avi">

    <EMBED src="AC.avi" width="1024" height="768" type="application/x-mplayer2" loop="true"></EMBED>

</object>

<button id="capture" onclick="captureImage();">Capture</button><br/>

<script type="text/javascript"> 

     var video; 

     var scale = 0.25;
 
     video = $("#video1").get(0); 

     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 tag=document.createElement("img");

     tag.src=canvas.toDataURL("image/jpeg");

     $("body").append(tag);

};

</script>

</body>
</html>
网页视频播放器 图片截取 HTML

相关资料更多>

  1. JSP编码以及乱码解决小结
  2. js两个旋钮（属性为butten，而不是submit）选择
  3. getElementById 有关问题
  4. Extjs温习笔记（三）
  5. javascript五子棋游戏制造（二）
  6. 有关ajax的有关问题
  7. javascript 判断汉字是不是相等
  8. 如何获取<body></body>间的全部代码
  9. 如何利用程序控制googlemap画自己想要的路线