求大神指导，如何对网页视频播放器进行画面截取~
我想在视频后方添加按钮对视频画面进行点击截取，截取后的图片保存在网页视频后方，图片点击右键可对其保存为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
[解决办法]
只有支持html5的浏览器支持
<!DOCTYPE HTML>
<html>
<head>
<title>Video test</title>
</head>
<body>
<video id="video1" width="320" height="240" controls="controls" autoplay="autoplay">
<source src="http://www.w3school.com.cn/i/movie.ogg" type="video/ogg" />
<source src="http://www.w3school.com.cn/i/movie.mp4" type="video/mp4" />
<source src="http://www.w3school.com.cn/i/movie.webm" type="video/webm" />
<object data="http://www.w3school.com.cn/i/movie.mp4" width="320" height="240">
<embed width="320" height="240" src="http://www.w3school.com.cn/i/movie.swf" />
</object>
</video>
<button id="capture" onclick="captureImage();">Capture</button><br/>
<script type="text/javascript">
var video;
var scale = 0.25;
video = document.getElementById('video1');
var captureImage = function() {
var canvas = document.createElement("canvas");
document.body.appendChild(canvas);
canvas.width = video.videoWidth * scale;
canvas.height = video.videoHeight * scale;
var ct=canvas.getContext('2d');
var tag=document.createElement("img");
ct.drawImage(video,0,0,canvas.width,canvas.height);
tag.src=canvas.toDataURL("image/jpeg");
document.body.appendChild(tag);
};
</script>
</body>
</html>
[解决办法]
目前只有html5的video 配合 canvas 可以截取图片
media player 没有提供这方面的接口，做不到