Atributo de póster de video HTML5 en Safari y Chrome

Question

En Firefox, la imagen especificada por el atributo de póster de la etiqueta VIDEO permanece en la pantalla hasta que se presiona el botón de reproducción. Sin embargo, en los navegadores Webkit (Safari y Chrome) el póster se descarga a favor del primer fotograma del video tan pronto como se recuperan los metadatos del video.

Quiero evitar tener que colocar el póster sobre el elemento de video manualmente si pudiera. ¿Alguien sabe de un arreglo para esto?

<video src="some_url" poster="images/poster.jpg"> 
    <source type="video/ogg" src="some_url" /> 
</video> 

Answer 1

Parece que WebKit quita el atributo tan pronto como el video es fethced, porque iOS 3.x para Iphone y Ipad tiene un error grave en los que no es posible reproducir el vídeo en absoluto cuando hay una Atributo del cartel especificado. Esto se solucionó en iOS 4, pero la solución aún se mantiene, incluso en Safari 5 ... Hay muchos usuarios que aún no se actualizaron a iOS 4, así que no hubo suerte con el póster ...

I Voy a tratar de posicionar la imagen completamente sobre el video usando Javascript, y eliminarla cuando se reproduce el video, esa parece ser la mejor solución ...

Answer 2

Si puede salirse con la suya sin precargar el video, puede set preload = "none" en el elemento de video. En Safari, esto hace que se muestre el póster.

Safari en iOS probablemente establezca preload = "none" como valor predeterminado para ahorrar ancho de banda, mientras que la versión de escritorio se precarga a menos que explícitamente indique que no lo haga.