Il tag video di HTML5 consente di definire, direttamente all'interno della pagina, un contenuto di tipo multimediale, senza necessità di plug-in esterni.
Una caratteristica interessante è quella di poter inserire i sottotitoli e lasciare al browser l'onere di visualizzarli.
<video controls autoplay loop src="video.mp4"> <track kind="subtitles" srclang="en" label="English" src="video.en.vtt"> <track kind="subtitles" srclang="it" label="Italiano" src="video.it.vtt" default> </video>
Il file referenziato è nel formato WebVTT e bisogna ricordarsi di registrare l'apposito MIME type text/vtt nel server, altrimenti alcuni browser non scaricheranno correttamente il file e non verranno visualizzati i sottotitoli.
Ecco un esempio del file referenziato, dove sono riportati in sequenza gli intervalli e il testo da visualizzare:
WEBVTT 00:00:00.000 --> 00:00:10.000 Esempio di sottotitolo sfruttando il tag <track> 00:00:10.000 --> 00:00:20.000 Questo è un sottotitolo con HTML5

Le specifiche WebVTT sono disponibili qui (ancora in draft):
http://dev.w3.org/html5/webvtt/
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Utilizzare @property per animare nativamente un oggetto HTML tramite CSS
Utilizzare i command service nei test con .NET Aspire
Abilitare il rolling update su Azure Functions flex consumption
Creare una UI per i tool MCP con resource e Azure Functions
Mappare una complex property di una entity su un campo JSON
Creare un indice su una colonna JSON in SQL Server
Creare popup e menu nativi in HTML con la Popover API
Utilizzare zizmor per rendere più sicuri i workflow di GitHub
Disabilitare la telemetria nella CLI di GitHub
Nuova modale riconnessione Blazor
Utilizzare ExecuteUpdate per aggiornare colonne JSON in Entity Framework
Gestione delle issue type con GitHub
I più letti di oggi
- Personalizare l'icona e le funzionalità di un sito web per iOS e IE
- Effettuare il multi-checkout in linea nelle pipeline di Azure DevOps
- Accedere a risorse e immagini in Windows Store app di Windows 8
- Effetto turnstile su tutte le pagine con il Windows Phone Toolkit
- Alleggerire le applicazioni WPF sfruttando gli oggetti Freezable
- Permettere il Drag-and-drop solo su zone predefinite con Silverlight 2.0
- Accedere a dati esposti con WebService con Silverlight 1.0


