Non funziona l'audio

**lanfrancofiorani** · 05-06-2024, 12.39.09

Nel mio sito in Altervista ho inserito alcuni programmi in JavaScript e funzionano bene nella parte visiva, ma non funziona la parte audio.
Da notare che questi stessi programmi, inseriti in altri siti, funzionano anche nella parte audio.
Desidererei sapere perché e come ovviare. Grazie

lanfrancofiorani

**alemoppo** · 05-06-2024, 22.11.08

JS è eseguito lato client, quindi se il codice è completo, il sito funziona come se hostato altrove. Puoi indicare una pagina dove si dovrebbe sentire l'audio?

Ciao!

**lanfrancofiorani** · 06-06-2024, 15.08.02

Il codice riportato qui sotto dà questo errore alla riga 12:
DOMException: The element has no supported sources

lanfrancofiorani

Codice:
<html>
<head>
<script language=JavaScript>
var sinistra=11
var alto=11
var direzione_s =false
var direzione_a =false
var sound
function beep1(beep) {
sound=document.getElementById("beep")
if (sound)
sound.play()
}
function avvia()
{
window.setInterval("muovi()",5)
}
function muovi()
{
var paragrafo=document.getElementById("tavola1")
if(direzione_s==false)
{sinistra++
if(sinistra==500){direzione_s=true; beep1('beep'); paragrafo.style.background="magenta"}
}
else
{sinistra--
if(sinistra==10){direzione_s=false; beep1('beep'); paragrafo.style.backgroundColor="blue"}
}

if(direzione_a==false)
{alto++
if(alto==380){direzione_a=true; beep1('beep'); paragrafo.style.backgroundColor="green"}
}
else
{alto--
if(alto==0){direzione_a=false; beep1('beep'); paragrafo.style.backgroundColor="cyan"}
}

para1.style.left=sinistra+"px"
para1.style.top=alto+"px"
}
</script>
</head>
<body language=JavaScript onload="avvia()">

<table border="3" width="510" height="400" bordercolor="red" id="tavola1" bgcolor="blue">
<tr>
<td>
<P Style="position:absolute; left:10px; top:20px;" Id="para1" ><img src="bullet1.gif"></P>
</td>
</tr>
</table>
<audio src="Beep.mp3" ID="beep"/></audio>
</body>
</html>

**GraphOGLRisorse** · 06-06-2024, 18.01.26

Salve,
il modo corretto per gestire l'audio con HTML è questo:

Codice HTML:

<audio id="beep">
  <source src="Beep.mp3" type="audio/mpeg">
  Il browser non supporta audio element.
</htnl>

Inoltre, per poter funzinare correttamente, il codice js va messo sotto alla parte HTML che gestisce l'audio.

In head ci mancano invece il titolo e il minimo dei meta tag ormai in uso con HTML5. Che l'aspetto grafico abbia uno sitle retro ci può stare, ma la struttura HTML dovrebbe essere aggiornata e completa.

Ho sistemato un po' il codice:

Codice HTML:

<!DOCTYPE html>
<html lang="it">
<head>
<title> </title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description"">
</head>
<body>

<table border="3" width="510" height="400" bordercolor="red" id="tavola1" bgcolor="blue">
<tr>
<td>
<P Style="position:absolute; left:10px; top:20px;" Id="para1" ><img src="bullet1.gif"></P>
</td>
</tr>
</table>
<audio id="beep">
  <source src="Beep.mp3" type="audio/mpeg">
  Il browser non supporta audio element.
</audio>

<script>
var sinistra=11;
var alto=11;
var direzione_s =false;
var direzione_a =false;

var sound = document.getElementById("beep");

function beep1(beep){
    sound.play();
}
function pause(beep){ 
    sound.pause(); 
} 

function avvia(){
    window.setInterval("muovi()",5);
}
function muovi(){
  var paragrafo=document.getElementById("tavola1");
  if(direzione_s == false){
    sinistra++;
    window.setTimeout("pause()",3000);
   if(sinistra == 500){direzione_s=true; beep1('beep'); paragrafo.style.background="magenta";}
  }else{
    sinistra--;
    window.setTimeout("pause()",3000);
   if(sinistra == 10){direzione_s=false; beep1('beep'); paragrafo.style.backgroundColor="blue";}
  }

  if(direzione_a == false){
     alto++;
    window.setTimeout("pause()",3000);
    if(alto == 380){direzione_a=true; beep1('beep'); paragrafo.style.backgroundColor="green";}
  }else{
    alto--;
    window.setTimeout("pause()",3000);
    if(alto == 0){direzione_a=false; beep1('beep'); paragrafo.style.backgroundColor="cyan";}
  }

  para1.style.left=sinistra+"px";
  para1.style.top=alto+"px";
}

avvia();
</script>

</body>
</html>

A me risulta funzionare così.

Cordiali saluti.

**lanfrancofiorani** · 06-06-2024, 18.55.50

Grazie Alemoppo eGraphOGLRisorse per le risposte
Controllando il codice mi sono accorto che nella riga:
<audio src="Beep.mp3" ID="beep"/></audio>
il nome del file audio è scritto con l'iniziale maiuscola Beep.mp3, mentre il nome sdel file è beep.mp3.
Evidentemente Altervista è Case sensitive e quidi dà errore, mentre in altri siti, non Case sensitive, la riga:
<audio src="Beep.mp3" ID="beep"/></audio>
non mi dava errore.
Grazie ancora e un saluto

lanfrancofiorani

**alemoppo** · 06-06-2024, 19.41.38

Confermo, su AlterVista gli URL sono case sensitive. Quindi problema risolto

Ciao!

Discussione: Non funziona l'audio

LinkBack

Strumenti discussione

Display

Non funziona l'audio

Regole di scrittura