{ Gestire gli eventi audio con javascript }

Un'utilità per ottimizzare pagine web.

L'oggetto audio HTML5 ha a sua disposizione molti eventi, quello analizzato in questo articolo è l'evento "onended" ossia alla fine del audio. Grazie a ques'ultimo possiamo captare l'istante in cui il audio termina ed eseguire un'operazione. Nel caso illustrato si fa un reindirizzamento ad una pagina web specifica che viene chiamata in causa dall'istruzione: window.location.assign

Codice:
<script type="text/javascript">
document.getElementById("audio").onended = function() {myFunction()};

function myFunction() {
    document.getElementById("avviso").innerHTML = "I'audio e' terminato.";
    window.location.assign("https://www.sitiweb.cloud")
}
</script>

Ora passiamo alla pagina completa di markup, il seguente esempio può essere copiato e incollato, è funzionante per fare i vostri test

Codice:
<!DOCTYPE html>
<html>
<head>
	<title>Gestire gli eventi audio - By Filomeni</title>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta name="author" content="Filomeni Maurizio (https://www.sitiweb.cloud)">
	
</head>

<body>
<p>In questo esempio viene impiegato l'HTML DOM per assegnare un evento "onended" all'elemento audio.</p>

<p>Premi play e attendi la fine dell'audio.</p>

<audio id="audio" controls width="560" height="315">
  
  <source src="https://www.sitiweb.cloud/aud/intro.mp3" type="audio/mp3">
  Your browser does not support the audio element.
</audio>

<p id="avviso"></p>

<script>
document.getElementById("audio").onended = function() {myFunction()};

function myFunction() {
    document.getElementById("avviso").innerHTML = "l'audio e' terminato.";
    window.location.assign("https://www.sitiweb.cloud")
}
</script>
</body>
</html>

Siti Web

Da 20 anni Filomeni Maurizio si dedica con passione e tenacia al mondo del web, le sue realizzazioni sono sempre all'avanguardia perchè la sua passione divenuta professione è al passo con i tempi e sempre in fase di studio e ricerca. Grazie ai suoi collaboratori riesce a dedicare il maggior tempo alla programmazione back-end rendendo le applicazioni molto precise e sofisticate. Dopo un attento monitoraggio, Siti Web diventa Partner Partnership di Aruba Group S.p.A

Newsletter & Info

Iscriviti alla nostra newsletter per ricevere aggiornamenti e novità, non riceverai mail indesiderate da parte nostra, odiamo lo spam!


Ti Piace Siti Web?