Показывать изображение плаката вместо видео при загрузке страницы

#javascript

#язык JavaScript

Вопрос:

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

 lt;video poster="myimage.png" src=myvideo.mp4 class="myvideo" controls="" loop=""   width="auto" height="300" alt="" gt;lt;/videogt;  
 $(document).ready(function() { $(".myvideo").on("mouseover", function(event) {  $(this).get(0).play();    }).on('mouseout', function(event) {  this.load();  }); })   {  let d = new Date();  text.value  = `${d.getHours()}:${d.getMinutes()}:${d.getSeconds()} | ${event.type} [target: ${event.target.id}]n`.replace(/(:|^)(dD)/, '$10$2');  text.scrollTop = text.scrollHeight; }  

Ответ №1:

Вы можете установить preload="none" тег на видео, чтобы избежать немедленной загрузки видео и object-fit: cover в стиле, чтобы ваше изображение покрывало видео.