Обрезать видео в HTML?
Я хочу обрезать видео в HTML 5.
<video id="glass" width="640" height="360" autoplay>
<source src="invisible-glass-fill.mp4" type="video/mp4">
</video>
Разрешение видео 640x360, но когда я устанавливаю атрибут width
на 200, видео будет масштабироваться (сохраняйте соотношение сторон). Как обрезать видео (отрезать, скажем, 220 пикселей как с левой, так и с правой стороны) через HTML или Javascript? Возможно ли это без обрезки видео через программное обеспечение для редактирования видео?
Ответы
Ответ 1
Я бы порекомендовал вам сделать это с помощью CSS и обертки:
HTML
<div class="container">
<video id="glass" width="640" height="360" autoplay>
<source src="invisible-glass-fill.mp4" type="video/mp4">
</video>
</div>
CSS
.container{
width: 200px;
overflow:hidden;
display:block;
height: 360px;
}
#glass{
margin-left: -220px;
}
Ответ 2
Что вы можете сделать, это использовать холст и скопировать часть понравившегося вам видео.
Вот несколько ссылок: http://developertip.wordpress.com/2011/06/04/tuto-html5-how-to-crop-a-video-tag-into-a-canvas-tag/