I video incorporati incollando l’URL di Vimeo presentano un’eccessiva spaziatura bianca sopra e sotto il video incorporato su dispositivi mobili.
Verifica questi URL su un dispositivo mobile per riprodurre il problema:
https://try.discourse.org/t/testing-video-embeds/1369
Screenshot:
Quello che sta succedendo qui è che il tag iframe ha una larghezza e un’altezza statiche, mentre il video incorporato di Vimeo si ridimensiona al 100% della larghezza e ha un’altezza automatica.
Questo accade anche con altri video incorporati nelle onebox non appena si avvia la riproduzione, ma in quel caso si prevede la variazione di dimensioni, quindi si utilizza tutto lo spazio del contenitore e si imposta uno sfondo nero.
Ecco un esempio con Dailymotion:
Penso che la soluzione più semplice sia dare all’iframe di Vimeo uno sfondo nero. Sarebbe così:
Abbiamo bisogno di un’altezza statica perché altrimenti il layout subirebbe salti durante il caricamento della pagina… non sono sicuro se possiamo o dovremmo fare qualcosa di più sofisticato, come determinare il rapporto d’aspetto e regolare le dimensioni per schermi più piccoli (@techAPJ)?
Sì, per ora rimaniamo con lo sfondo nero.
Lo stesso è successo con Streamable.
