2012-04-16 5 views
5

Esiste una tecnica semplice per riprodurre solo una determinata parte di un video HTML5? Ad esempio in una clip di 30 secondi vorrei suonare solo la parte 5-20 sec. Inoltre, il resto del video non dovrebbe essere accessibile dall'interfaccia utente (il che significa che la timeline del video dovrebbe mostrare solo la parte di 5-20 secondi).HTML5 video - riproduzione solo di una parte di un video

Ho visto alcuni lettori video HTML5 ma nessuno di loro sembra supportare questo tipo di funzionalità. Se qualcuno conosce un (buon) metodo per implementare questa funzione, per favore mi dia un suggerimento.

Grazie in anticipo!

+0

Ho fatto alcuni esperimenti utilizzando il riproduttore VideoJS (http://videojs.com/) e sono riuscito a farlo funzionare almeno su desktop, dispositivi Android e iPad. – calle

+0

Fondamentalmente ho dovuto scavalcare alcune delle funzionalità del player originale per rendere correttamente i controlli e giocare con l'evento 'timeupdate' del video per limitare il tempo di riproduzione del video. Devo concordare con @Riplikash che attualmente l'unico modo decente per realizzare il gioco parziale è quello di servire il contenuto giocabile dal server e non provare a restringerlo dal lato client. – calle

risposta

1

Anche se questa domanda è già stata contrassegnata come risposta, ecco qualcosa che potrebbe interessare te e chiunque altro inciampi qui: Specifying playback range.

Fa parte di Media Fragment API e attualmente funziona nelle ultime versioni di Firefox, Chrome e Safari 6+.

+0

Questa risposta è utile rispetto a quella contrassegnata corretta. Grazie @Ian Devlin –

+0

Questo link non è più valido, non ci sono informazioni in merito a come specificare l'intervallo di riproduzione. – prendio2

0

È possibile implementarlo. C'è un evento Player.Play() in un giocatore, ogni volta che Play() chiama start un timer e chiama Player.stop() sull'ora specifica che si desidera.

0

ho avuto lo stesso problema e non ho trovato qualcosa che può risolve questo problema, cosa si può fare è quello di implementare i propri controlli e visualizzare il video con una tela ...

e se siete non riuscirai a farlo cercando di implementarlo in IOS.

+0

Con javascript potresti essere in grado di riprodurre il tempo parziale desiderato ma l'interfaccia utente mostrerà il tempo reale, puoi nascondere i controlli originali ma l'utente potrebbe essere in grado di visualizzarli con "clic destro" -> "mostra controlli "il modo più vicino che ho trovato è stato usare un giocatore che mostra un tempo parziale era JWPlayer, può mostrare una durata" falsa "ma l'ora di inizio è sempre 0 anche quando puoi iniziare in un altro punto ... –

+0

ma in iOS non funziona ... –

0

Il mio pensiero sarebbe quello di utilizzare controlli personalizzati, in quanto non credo che la funzionalità sia disponibile in modo nativo. Tutte le funzionalità dei controlli html5 (play, pause, start at timestamp, ecc.) Possono essere richiamate tramite javascript. In questo caso vorrai modificare la variabile currentTime.

Quindi potresti prendere in considerazione la possibilità di impostare il tuo cursore, dove l'inizio del cursore rappresenta il punto di partenza e il punto finale. Imposta il video da non riprodurre al caricamento della pagina. Quindi, al caricamento della pagina, una funzione javascript modifica il tempo corrente sul punto di partenza. Per l'interruzione potresti occasionalmente interrogare il tempo corrente. Non userei un timer in quanto ritardi come il caricamento lento potrebbero buttarlo via.

+0

Non sarai in grado di limitare completamente gli utenti a vedere altre parti del video tramite video HTML5. È un po 'come il tag . È molto aperto Dovresti limitare le parti del video che verranno pubblicate sul server. – Riplikash

+0

Vuoi qualche frammento di codice funzionante –

0

Sto cercando di implementare un video simile in "Modalità anteprima". Sto utilizzando i metodi indicati sopra aggiungendo un listener di eventi e quindi mettendo in pausa il video a una posizione currentTime() == 'x'. Per impedire all'utente di colpire semplicemente di nuovo il gioco, il listener currentTime non consentirà la riproduzione oltre la "x" ora nella timeline, quindi ogni volta che l'utente preme il gioco, viene automaticamente messo nuovamente in pausa. Inoltre, al momento "x" il contenitore video verrà nascosto tramite CSS, impedendo così l'interazione dell'utente con il video.