Chụp ảnh màn hình từ trình phát video HTML5-JavaScript

Bạn có thể thử chạy mã sau để chụp ảnh từ trình phát video dựa trên HTML5-JavaScript −

Ví dụ

<html>    <body>       <video controls>          <source src = "new.mp4" type = "video/mp4"></source>       </video>       <canvas id = "canvas" width = "600" height = "300"></canvas>       <button id = "snap" onclick = "snap()">Chụp ảnh</button>       <script>          var video = document.querySelector('video');          var canvas = document.querySelector('canvas');          var context = canvas.getContext('2d');          var myWidth, myHeight, ratio;                    video.addEventListener('loadedmetadata', function() {             ratio = video.videoWidth/video.videoHeight;             myWidth = video.videoWidth-100;             myHeight = parseInt(w/ratio,10);             canvas.width = myWidth;             canvas.height = myHeight;          },false);          function snap() {             context.fillRect(0,0,myWidth,myHeight);             context.drawImage(video,0,0,myWidth,myHeight);          }       </script>    </body> </html>