góc - chụp <video> khung cuối cùng như video tấm áp phích/thumb

Question

Mã của tôi rất đơn giản:

<video ng-controller="Ctrl" ng-src="scopeSRC" autoplay></video> 

.controller('Ctrl', function ($scope, $timeout) { 

    $scope.scopeSRC = 'a_src_url'; 

    $timeout(function() { 
    $scope.scopeSRC = 'new_src_url'; 
    }, 5000); 
}); 

Bây giờ khi thay đổi src tôi xem đoạn video đen. Những gì tôi muốn làm là đặt khung cuối cùng của video src trước đó làm hình thu nhỏ trong khi src mới đang tải.

Bạn nghĩ tôi có thể đạt được điều này như thế nào?

Cảm ơn, bất kỳ sự giúp đỡ đánh giá cao

Answer 1

Thay vì có 1 phần tử video và thay đổi src, sử dụng 2 yếu tố video được xếp lớp lên nhau sử dụng z-index khác.

Khi bạn muốn chuyển, tạm dừng phần tử video hiện tại, hãy chờ phần tử video thứ hai tải (nghe các sự kiện loadeddata/canplay/canplaythrough). Sau đó hoán đổi chỉ mục z để phần tử video tiếp theo ở trên đầu và sau đó phát phần tử video thứ hai.