Tenga una imagen que reproduzca video al pasar el mouse. Va a la imagen del póster onmouseout. El único problema es que no muestra la imagen del póster cuando la página se carga por primera vez, muestra el video (no se reproduce, solo la imagen de la pantalla de inicio del video). Todo lo demás funciona bien, solo quiero que la imagen del póster se muestre cuando la página se cargue por primera vez. No soy el mejor con el guión, así que no estoy seguro de qué más probar. Cualquier y toda ayuda es apreciada.
<video poster="myimage.png" src=myvideo.mp4 class="myvideo" controls="" loop="" width="auto" height="300" alt="" ></video> $(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(/(:|^)(\d\D)/, '$10$2'); text.scrollTop = text.scrollHeight; }Puede configurar preload="none" en la etiqueta de video para evitar cargar el video de inmediato y object-fit: cover con estilo para que su imagen cubra el video.