Dopo aver inserito il codice HTML degli elementi video e audio entrambi diventano accessibili via JavaScript, come oggetti di tipo
HTMLMediaElement, mettendo a disposizione proprietà, funzioni ed eventi. Considerando, come esempio, l’elemento video utilizzato nel precedente
articolo che viene ottenuto nel seguente modo:
var media = document.getElementById("video_container");
iniziamo a descriverne le proprietà:
- error consente di verificare se è occorso un errore durante il processo di ottenimento del media element. Se non vi è stato alcun errore la proprietà avrà valore null altrimenti avrà come valore un oggetto di tipo MediaError, che esporrà, attraverso la proprietà code, il codice di errore ritornato. Esso può assumere i valori: MEDIA_ERR_ABORTED (1), indicante che il processo di ottenimento della risorsa è stato interrotta da una richiesta dell’utente, MEDIA_ERR_NETWORK (2), indicante un errore di rete che ha interrotto il caricamento del media, MEDIA_ERR_DECODE (3), indicante un errore nel processo di decodifica del media e MEDIA_ERR_SRC_NOT_SUPPORTED (4), indicante che l’attributo src non è ottenibile perché, ad esempio, all’URL indicato la risorsa non è presente o perché il formato non è supportato;
- src, di tipo DOMString, permette di ottenere o di impostare l’URL dell’elemento media da scaricare. Se si utilizza l’elemento source tale proprietà sarà una stringa vuota;
- currentSrc, di tipo DOMString, ritorna l’URL, come path assoluto, dell’elemento media eventualmente scaricato;
- networkState consente di ottenere informazioni sulle fasi di “dialogo” tra l’elemento media e la rete. Esso può assumere i seguenti valori: NETWORK_EMPTY (0), indicante che l’elemento media non è stato ancora inizializzato avendo tutti i suoi valori in uno stato di default; NETWORK_IDLE (1), indicante che non c’è alcuna interazione con la rete perché, ad esempio, il video è stato caricato; NETWORK_LOADING (2), indicante l’attività di downloading della risorsa; NETWORK_NO_SOURCE, indicante il mancato reperimento della risorsa;
- preload, di tipo DOMString, consente di ottenere o specificare la modalità di downloading della risorsa. Esso può assumere i valori: none, metadata e auto;
- buffered ritorna un oggetto di tipo TimeRanges che rappresenta le parti temporali di una risorsa bufferizzata. Esso ha la proprietà length, indicante quante parti sono disponibili e i metodi: double start(unsigned long index), indicante di quale parte (data dal parametro index) vogliamo sapere il tempo, in secondi, di inizio; double end(unsigned long index), indicante di quale parte (data dal parametro index) vogliamo sapere il tempo, in secondi, di fine. In pratica, quest’attributo consente di sapere quanti periodi di tempo — da una posizione iniziale a una finale come una sorta di timeline — della risorsa multimediale sono disponibili per la visualizzazione e lo spostamento senza necessità di mettere in pausa la riproduzione per caricare altre parti della risorsa.
- Pubblicazioni correlate:
- 10-05-2010 Guida ad HTML5: storia della sua nascita (1/3)
- 11-05-2010 Guida ad HTML5: storia della sua nascita (2/3)
- 17-05-2010 Guida ad HTML5: storia della sua nascita (3/3)
- 18-05-2010 Guida ad HTML5: supporto dei browser (1/6)
- 24-05-2010 Guida ad HTML5: supporto dei browser (2/6)
- 25-05-2010 Guida ad HTML5: supporto dei browser (3/6)
- 31-05-2010 Guida ad HTML5: supporto dei browser (4/6)
- 01-06-2010 Guida ad HTML5: supporto dei browser (5/6)
- 07-06-2010 Guida ad HTML5: supporto dei browser (6/6)
- 08-06-2010 Guida ad HTML5: l'elemento canvas, l'area del disegno
- 14-06-2010 Guida ad HTML5: l’elemento canvas, disegno di forme geometriche (1/4)
- 18-06-2010 Guida ad HTML5: l’elemento canvas, disegno di forme geometriche (2/4)
- 21-06-2010 Guida ad HTML5: l’elemento canvas, disegno di forme geometriche (3/4)
- 25-06-2010 Guida ad HTML5: l’elemento canvas, disegno di forme geometriche (4/4)
- 28-06-2010 Guida ad HTML5: l’elemento canvas, immagini e testo (1/4)
- 02-07-2010 Guida ad HTML5: l’elemento canvas, immagini e testo (2/4)
- 05-07-2010 Guida ad HTML5: l’elemento canvas, immagini e testo (3/4)
- 09-07-2010 Guida ad HTML5: l’elemento canvas, immagini e testo (4/4)
- 12-07-2010 Guida ad HTML5: l’elemento canvas, manipolazione diretta dei pixel (1/2)
- 16-07-2010 Guida ad HTML5: l’elemento canvas, manipolazione diretta dei pixel (2/2)
- 19-07-2010 Guida ad HTML5: l’elemento canvas, sfumature
- 23-07-2010 Guida ad HTML5: l’elemento canvas, ombreggiature
- 26-07-2010 Guida ad HTML5: l’elemento canvas, compositing (1/2)
- 30-07-2010 Guida ad HTML5: l’elemento canvas, compositing (2/2)
- 30-08-2010 Guida ad HTML5: l’elemento canvas, stili di linea e pattern (1/2)
- 03-09-2010 Guida ad HTML5: l’elemento canvas, stili di linea e pattern (2/2)
- 06-09-2010 Guida ad HTML5: multimedialità, concetti propedeutici (1/2)
- 10-09-2010 Guida ad HTML5: multimedialità, concetti propedeutici (2/2)
- 13-09-2010 Guida ad HTML5: multimedialità, l'elemento video
- 17-09-2010 Guida ad HTML5: multimedialità, gli elementi audio e source
- 20-09-2010 Guida ad HTML5: multimedialità, scripting dei media element (1/6)
- 24-09-2010 Guida ad HTML5: multimedialità, scripting dei media element (2/6)
- 01-10-2010 Guida ad HTML5: multimedialità, scripting dei media element (4/6)
- 04-10-2010 Guida ad HTML5: multimedialità, scripting dei media element (5/6)
- 08-10-2010 Guida ad HTML5: multimedialità, scripting dei media element (6/6)
- 11-10-2010 Guida ad HTML5: multimedialità, realizzazione di un player video (1/7)
- 15-10-2010 Guida ad HTML5: multimedialità, realizzazione di un player video (2/7)
- 20-10-2010 Guida ad HTML5: multimedialità, realizzazione di un player video (3/7)
- 22-10-2010 Guida ad HTML5: multimedialità, realizzazione di un player video (4/7)
- 25-10-2010 Guida ad HTML5: multimedialità, realizzazione di un player video (5/7)
- 29-10-2010 Guida ad HTML5: multimedialità, realizzazione di un player video (6/7)
- 05-11-2010 Guida ad HTML5: multimedialità, realizzazione di un player video (7/7)
- 08-11-2010 Guida ad HTML5: storage per le web application (1/3)
- 12-11-2010 Guida ad HTML5: storage per le web application (2/3)
- 15-11-2010 Guida ad HTML5: storage per le web application (3/3)
- 19-11-2010 Guida ad HTML5: eseguire codice JavaScript in background (1/3)
- 22-11-2010 Guida ad HTML5: eseguire codice JavaScript in background (2/3)
- 26-11-2010 Guida ad HTML5: eseguire codice JavaScript in background (3/3)
- 29-11-2010 Guida ad HTML5: applicazioni web offline (1/5)
- 03-12-2010 Guida ad HTML5: applicazioni web offline (2/5)
- 06-12-2010 Guida ad HTML5: applicazioni web offline (3/5)
- 10-12-2010 Guida ad HTML5: applicazioni web offline (4/5)
- 13-12-2010 Guida ad HTML5: applicazioni web offline (5/5)
- 17-12-2010 Guida ad HTML5: la geolocalizzazione (1/4)
- 20-12-2010 Guida ad HTML5: la geolocalizzazione (2/4)
- 24-12-2010 Guida ad HTML5: la geolocalizzazione (3/4)
- 27-12-2010 Guida ad HTML5: la geolocalizzazione (4/4)
- 31-12-2010 Guida ad HTML5: microdata (1/4)
- 03-01-2011 Guida ad HTML5: microdata (2/4)
- 10-01-2011 Guida ad HTML5: microdata (3/4)
- 14-01-2011 Guida ad HTML5: microdata (4/4)
- 17-01-2011 Guida ad HTML5: drag and drop (1/5)
- 21-01-2011 Guida ad HTML5: drag and drop (2/5)
- 24-01-2011 Guida ad HTML5: drag and drop (3/5)
- 28-01-2011 Guida ad HTML5: drag and drop (4/5)
- 31-01-2011 Guida ad HTML5: drag and drop (5/5)
- 04-02-2011 Guida ad HTML5: nuovi elementi semantici (1/6)
- 07-02-2011 Guida ad HTML5: nuovi elementi semantici (2/6)
- 11-02-2011 Guida ad HTML5: nuovi elementi semantici (3/6)
- 14-02-2011 Guida ad HTML5: nuovi elementi semantici (4/6)
- 18-02-2011 Guida ad HTML5: nuovi elementi semantici (5/6)
- 21-02-2011 Guida ad HTML5: nuovi elementi semantici (6/6)
- 25-02-2011 Guida ad HTML5: l’API di messaggistica (1/8)
- 28-02-2011 Guida ad HTML5: l’API di messaggistica (2/8)
- 04-03-2011 Guida ad HTML5: l’API di messaggistica (3/8)
- 07-03-2011 Guida ad HTML5: l’API di messaggistica (4/8)
- 11-03-2011 Guida ad HTML5: l’API di messaggistica (5/8)
- 14-03-2011 Guida ad HTML5: l’API di messaggistica (6/8)
- 18-03-2011 Guida ad HTML5: l’API di messaggistica (7/8)
- 21-03-2011 Guida ad HTML5: l’API di messaggistica (8/8)