以下のコードは、IE 10、Firefox、Safari、Mac Chromeでは動作しますが、Windows Chrome では動作しないという問題があります。
$(function () {
var video_dom = document.querySelector('#v');
var canvas_draw = document.querySelector('#c');
var draw_interval = null;
video_dom.addEventListener('play', function () {
video_dom.width = canvas_draw.width = video_dom.offsetWidth;
video_dom.height = canvas_draw.height = video_dom.offsetHeight;
var ctx_draw = canvas_draw.getContext('2d');
draw_interval = setInterval(function () {
ctx_draw.drawImage(video_dom, 0, 0, video_dom.width, video_dom.height);
var dataURL = canvas_draw.toDataURL();
document.getElementById('canvasImg').src = dataURL;
}, 3500)
}, false);
})();
また、コンソールに次のようなエラーが表示されますUncaught TypeError: object is not a function
。
キャンバスがMacバージョンでは機能するのに、 WindowsバージョンのChromeでは機能しないのはなぜですか?