Capturar el fotograma de video actual
Acción de barra que guarda el fotograma actual del video en reproducción como archivo PNG.
Código para copiar
// Toolbar action: capture the current frame of the playing video.
(function () {
var videos = Array.prototype.slice.call(document.querySelectorAll('video'));
videos.sort(function (a, b) {
return (b.clientWidth * b.clientHeight) - (a.clientWidth * a.clientHeight);
});
var v = videos[0];
if (!v || !v.videoWidth) { alert('No playable video found.'); return; }
try {
var c = document.createElement('canvas');
c.width = v.videoWidth;
c.height = v.videoHeight;
c.getContext('2d').drawImage(v, 0, 0, c.width, c.height);
var a = document.createElement('a');
a.href = c.toDataURL('image/png');
a.download = 'video-frame-' + Math.round(v.currentTime) + 's.png';
document.body.appendChild(a);
a.click();
a.remove();
} catch (e) {
alert('Could not capture this frame: ' + e.message);
}
})();
Cómo usar este ejemplo
- Copia el código con el botón de arriba.
- Instala JustZix (2 minutos) y abre la extensión en la página de destino.
- Añade una nueva regla que coincida con esa página.
- Activa el panel de acciones, añade un botón en la pestaña Acciones y pega el código en él — lo ejecutas con un clic.
Valora este ejemplo
Sin valoraciones — sé el primero.