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

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

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

求大神指导，如何对网页视频播放器进行画面截取~
我想在视频后方添加按钮对视频画面进行点击截取，截取后的图片保存在网页视频后方，图片点击右键可对其保存为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. Extjs4-文件下传，后台struts2
  2. eclipse设置新建jsp文件默认字符编码替utf-8
  3. javascript的函数调用，哪位高手来救救小弟我啊
  4. JS记时代码
  5. 【转】 深入懂得Servlet/JSP之“Cookie和Session原理”
  6. 请教这个函数是做什么用的
  7. extjs中dataview例证
  8. NodeJs 惯用npm框架
  9. 请教下js要导入一个30来M的json格式的数组