Видео HTML 5 показывает черный экран после воспроизведения видео

#html #html5-video

#HTML #html5-video

Вопрос:

У меня загружается видео в <video&&t; теге.

Оно настроено на воспроизведение только один раз, т. е. оно не зацикливается.

После завершения воспроизведения видео просто отображается черный экран. Я пытался добавить poster атрибут, но, насколько я понимаю, он используется до загрузки видео, а не после. Большинство доступных решений направлены на предотвращение появления черного экрана перед видео, а не после, и они не касаются одиночных видеороликов.

  1. Как я могу предотвратить отображение этого черного экрана?
  2. Могу ли я добавить другое изображение или первый кадр видео после завершения воспроизведения видео?

 <video width="400" autoplay="" muted="" playsinline="" class="" style="max-width:100%;paddin&:0px;" poster="//cdn.shopify.com/s/files/1/0017/4227/4613/files/COST-GRAPH_450x.pn&?v=9334525452384790062"&&t;
    <source src="https://cdn.shopify.com/s/files/1/0017/4227/4613/files/CG1.25X_compressed.mp4?v=1596956587" type="video/mp4"&&t;
</video&&t;  

Ответ №1:

потому что последний кадр источника видео черный.

постер

URL-адрес изображения, которое будет отображаться во время загрузки видео. Если этот атрибут не указан, ничего не отображается, пока не будет доступен первый кадр, тогда первый кадр отображается как рамка плаката.

И ниже показан пример, когда последний кадр в порядке. вы этого ожидали?

 <video controls width="250"&&t;

    <source src="https://interactive-examples.mdn.mozilla.net/media/examples/flower.mp4"
            type="video/mp4"&&t;

    Sorry, your browser doesn't support embedded videos.
</video&&t;  

Комментарии:

1. Вы правы, последний кадр черный. Мой плохой. Спасибо!