Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> JavaScript

เล่นวิดีโอบน canvas และเก็บเฟรมสุดท้าย/ภาพไว้บน HTML5 Canvas

ลองรันโค้ดด้านล่างเพื่อเล่นและเก็บเฟรมสุดท้ายของวิดีโอ:

var c = $('canvas')[0];
var context = canvas.getContext('2d');
c.width = 640;
c.height = 480;
$("#myPlayer").on('play', function (e) {
  var $this = this;
  (function loop() {
    if (!$this.paused && !$this.ended) {
      context.drawImage($this, 0, 0, 640, 480);
      setTimeout(loop, 1000 / 30);
    }
  })();
});