Ver Mensaje Individual
  #1 (permalink)  
Antiguo 19/04/2015, 06:27
robertoferran
Invitado
 
Mensajes: n/a
Puntos:
Video descentrado (o no visible) en dispositivos móviles. html5.

Hola a todos de nuevo.

Hace poco tenía una duda sobre cómo insertar un video en html5 centrado de fondo (sin que fuese a pantalla completa), y el usuario: mbm150 me lo resolvió perfectamente así:
http://www.forosdelweb.com/f4/video-fondo-centrado-1125192/

El problema es que en dispositivos móviles (iPhones, iPads, móviles Android, etc) no sale centrado, sino pegado a la izquierda.

Así es cómo se ve en un ordenador de sobremesa:
http://imageshack.com/a/img537/8660/dttbER.jpg

Así es cómo se ve en un iPad Mini:
http://imageshack.com/a/img538/971/hlngIY.jpg

Así es cómo se ve en un iPhone 4:
http://imageshack.com/a/img913/3767/46WgZQ.jpg

El ancho que yo le dí a la web es de 1024 pixeles, y el video tiene de ancho 1920 pixeles por 451 pixeles de alto.

Tengo tres preguntas, a ver si alguien me pudiese ayudar:

1. Aún siendo el ancho del video mayor que el ancho de la web, hay alguna manera de que toda la web y el video se vean centrados también en dispositivos móviles?

2. El vídeo no se visualiza en dispositivos móviles (está colgado en mp4, webm, y ogv). Que tengo que hacer para que se vea en dispositivos móviles?

3. Si veo que es un problema que se visualice el video en dispositivos móviles, qué tengo que hacer para que cuando se acceda a la web desde un dispositivo movil, se muestre el "poster" (centrado y no pegado a la izquierda) y no el video?

Os pego el código html y el css. Ojalá me podáis ayudar de nuevo. Gracias de antemano.