iOS 4.2.1 Safari mobile non mostrerà l'immagine del poster

Question

Ho lavorato su un sito specifico per iPad che utilizza video HTML5 e sebbene abbia funzionato la riproduzione di video, non posso per la vita di me ottenere l'immagine del poster per apparire. Sembra buono su Desktop Safari. Ecco il codice:

<video src="video/about_the_man.mp4" controls height=360 width=480 poster="video/posters/about_the_man.jpg"></video> 

ho utilizzando questo link come riferimento (1.2): http://developer.apple.com/library/safari/#documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/AudioandVideoTagBasics/AudioandVideoTagBasics.html#//apple_ref/doc/uid/TP40009523-CH2-SW6

Si dice che su iOS l'immagine del poster sarà visualizzata finché l'utente avvia la riproduzione, ma in questo momento tutto quello che sto ottenendo è uno schermo nero di dimensioni video con un grande pulsante di riproduzione al centro. Ho visto altri post su questo top (here e here) ma nessuna soluzione ha funzionato per me. L'unica cosa che non è convenzionale del sito è che l'elemento video si trova in una lightbox in linea, quindi inizialmente sul pageload non è visibile, ma non so perché questo potrebbe fare la differenza.

Qualche idea?

Answer 1

Ho avuto lo stesso identico problema. Ho deciso di provare il mio codice su altri iPad, e ha funzionato bene. L'immagine del poster si presentò.

Dopo aver graffiato la mia testa per un po ', la soluzione era quella di ripristinare l'iPad e riprovare. Dopo un riavvio, il mio iPad ha mostrato l'immagine del poster come dovrebbe.

Forse funzionerà per voi?

Answer 2

ho trovato c'è un limite alla quantità di immagini è possibile caricare su un iPad

Qui è quello che dice:

mi ha colpito un limite Safari mobile di recente, quando la costruzione di un AJAX-y sito sull'iPad. Se carichi una tonnellata di immagini, eventualmente Safari mobile interrompe lo e visualizzerà un [?] Invece dell'immagine. Dopo aver eseguito alcuni test , sembra che questo limite sia di circa 6,5 ​​MB. Ecco una pagina di prova Ho tentato di caricare 20 immagini da 500kb. Quando si apre questa pagina su un iPad, 7 delle immagini non vengono visualizzate, anche se in Charles esse restituiscono 200 - esito positivo. Suppongo che questo sia simile al modo in cui la riproduzione automatica è disabilitata per il tag video su iPad/iPhone. Apple probabilmente vuole assicurarsi che gli utenti non siano sovraccaricati di download quando la navigazione è su 3G.

In ogni caso, 6,5 MB è un carico pesante e non sarebbe la passeranno bene su 3G, ma per un motivo o per l'altro si potrebbe voler aggirare questa limitazione. Ho trovato che il modo più semplice per correggere il mio codice era caricare l'immagine in un tag canvas usando drawImage(). Il tag canvas sembra essere immune dalla limitazione.

Ecco il codice another test page utilizzando il tag canvas, tutte le immagini dovrebbero essere caricate.