HTML5はビデオと動的なスクリーンショットの実装の手順とコードを再生します（他の未テストのサファリをサポートします）

コメント：HTML5はビデオを再生し、非常にファッショナブルでクールな機能であるダイナミックスクリーンショットは、現在クロムをサポートせず、他のテストされていないサファリをサポートしています。知る必要がある場合は、適切に参照してください

最初にjQueryアドレスを参照してください。 Sina'sを選択してください

<script type = "text/javascript" src = "http://lib.sinaapp.com/js/jquery/1.6/jquery.js"> </script>

ビデオタグを追加します

<ビデオコントロール= "controls">

<source src = "1.mp4" />

</video>

その後、JS

<script type = "text/javascript">

$（）。ready（function（）{

varビデオ、出力;

varスケール= 0.25;

var initialize = function（）{

output = $（ "＃output"）;

ビデオ= $（ "＃ビデオ"）。get（0）;

$（ "＃capture"）。クリック（CaptureImage）;

};

var CaptureImage = function（）{

var canvas = document.createelement（ "canvas"）;

canvas.width = video.videowidth *スケール;

canvas.height = video.videoheight *スケール;

canvas.getContext（ '2d'）

.drawimage（ビデオ、0、0、canvas.width、canvas.height）;

var img = document.createelement（ "img"）;

img.src = canvas.todataurl（）;

output.prept（img）;

};

$（初期化）;

}）;

</script>

レンダリングは投稿しません。