Có ai biết nếu video html5 cho phép các đối tượng như nút, menu, v.v. kết nối với dòng thời gian không?Các đối tượng tương tác video html5
Trình phát flash Youtube thực hiện việc này: trong thời điểm cụ thể, hiển thị đối tượng (biểu ngữ, liên kết, nhận xét) qua video cho các giây được xác định.
nhờ
Có và không, Có thể để tạo ra các bài thuyết trình dựa trên video rất tương tác sử dụng đối tượng video HTML5 tuy nhiên nó đòi hỏi nhiều hơn chỉ là đối tượng video. Bạn có thể lồng video vào đối tượng canvas sau đó lộn xộn với khung hình video thực, bạn có thể che phủ bất kỳ phần tử html trực quan nào trên chính đối tượng video sau đó tạo hoạt ảnh, bạn có thể điều khiển phát lại video bằng các nút, nhấp vào sự kiện, v.v. thậm chí có đối tượng video điều khiển phần còn lại của trang với trình nghe dựa trên thời gian.
Popcorn.js thực sự thực sự tốt và dễ học, cho phép bạn làm tất cả những gì bạn đã đề cập. http://popcornjs.org
tôi đoán video bên trong canvas là giải pháp hoàn chỉnh nhất. – Mike
có nó là một môi trường được kiểm soát nhiều hơn so với dom cũng là nó thường ít tài nguyên nặng như các yếu tố dom được trả lại hơi khác nhau bởi trình duyệt và phải chịu rất nhiều người nghe toàn cầu và sự kiện. nó sẽ dễ tiếp cận hơn để làm điều đó thông qua dom mặc dù. – Alex
Đó không phải là một phần của chuẩn video HTML5, nhưng rất dễ dàng để thực hiện thủ công bằng dây lên một số kịch bản để sự kiện progress. Bằng cách xem thuộc tính currentTime của đối tượng video, bạn có thể quyết định thời điểm hiển thị/ẩn các phần tử bổ sung.
ví dụ cho thấy một yếu tố trên đầu trang của một đoạn video từ 1 đến 2 giây thành một video:
<video id="v">...</div>
<div id="overlay" style="position: relative; top: -80px;">HELLO</div>
<script type="text/javascript">
var overlay= document.getElementById('overlay');
var video= document.getElementById('v');
video.addEventListener('progress', function() {
var show= video.currentTime>=1 && video.currentTime<2;
overlay.style.visibility= show? 'visible' : 'hidden';
}, false);
</script>
Ngoài ra, nếu nó chỉ đơn giản là văn bản tĩnh WebVTT (và một trong nhiều polyfills trên mạng) có thể được sử dụng. –
X2TV (www.x2.tv) có một kéo và thả phòng thu, nơi bạn có thể che phủ các biểu tượng và nội dung bổ sung trong lớp HTML5.
Trong trường hợp bạn muốn sử dụng khung chung chung hơn https://github.com/nise/vi-two có thể thú vị cho bạn.
Thẻ Video HTML5 phát video nhưng cũng có nhiều tính năng cho phép bạn thêm lớp tương tác ở đầu video. Popcorn.js thực hiện điều này và H5P cũng có thư viện video tương tác, nơi bạn có thể thêm thông tin văn bản, hình ảnh và câu đố bổ sung vào dòng thời gian video. – Almonds