[HTML] Caricamento Audio con matching

[fazbit]

Ciao a tutti,

ho l'esigenza di fare una pagina web molto semplice ( intestazione e 6 bottoni con associati dei suoni) ma con le seguenti condizioni:

1. Al caricamento della pagina web deve partire un file audio (random tra un lista di 6 files)
2. A fine caricamento del file audio premere il bottone corrispondente del file audio riprodotto.
3. In caso di corrispedenza file audio riprodotto == bottone premuto -->animare il bottone

Secondo voi è possibile?

che software posso usare?

Grazie mille in anticipo a tutti per l'aiuto

Ciao

 

[tess]

Sarabanda

 

[Max 1]

Sarabanda

Ecosa sarebbe? Io conosco una trasmissione TV o abbigliamento con quel nome!

 

[tess]

Scherzi a parte si può fare ma richiede tempo, quindi inizia tu e continuiamo insieme se hai domande...

 

[Max 1]

Scherzi a parte si può fare ma richiede tempo, quindi inizia tu e continuiamo insieme se hai domande...

La domanda te la fatta! Cosa gai da proporre?

 

[tess]

Puoi usare i linguaggi JavaScript e PHP

 

[Max 1]

@tess
Fammi il piacere se non sai cosa dire e devi scrivere solo cose insensate lascia perdere tralascia d'intervenire!
Grazie

 

[fazbit]

Ciao a Tutti per ora ho trovato questo:

<!-- Audio Casuale -Inizio -->
<style>
audio{ width: 0px; height: 0px; }
</style>
<script type='text/javascript'>
//<![CDATA[
// Musica casuale
var music_clip = [
"https://sites.google.com/site/musicafilemp3/musica-casuale/Brano1.mp3",
"https://sites.google.com/site/musicafilemp3/musica-casuale/Brano2.mp3",
"https://sites.google.com/site/musicafilemp3/musica-casuale/Brano3.mp3",
"https://sites.google.com/site/musicafilemp3/musica-casuale/Brano4.mp3",
"https://sites.google.com/site/musicafilemp3/musica-casuale/Brano5.mp3",
"https://sites.google.com/site/musicafilemp3/musica-casuale/Brano6.mp3"];
var rotazione = Math.random()*music_clip.length;
var numero = Math.floor(rotazione);
document.write('<audio controls="true" autoplay="autoplay">');
document.write('<source src='+music_clip[numero]+' type="audio/mpeg">');
document.write('</audio>');
//]]>
</script>
<!-- Audio Casuale - Fine -->


<button id="a" onclick="myFunction()">Campanello</button>

<script>
function myFunction() {
  
//CONDIZIONE DA INSERIRE
// SE CORRETTO BOTTONE VERDE ALTRIMENTI ROSSO



    }
    document.getElementById("a").style.color = "red";
}

Diciamo che per far partire i file random ci siamo, ora il punto é memorizzare il file riprodotto e inserirlo in una variabile per poi impostare la condizione

 

[fazbit]

        <footer> <a href="#" class="button" onclick="start()" >Get Started</a> </footer>
        
      </div>
    </section>
    <!-- Audio Casuale -Inizio -->
 
            
<style>
audio { width: 1000px; height: 100px; }
</style>
<script type="text/javascript">
function start() { 
var music_clip = [
 "C:/SUONI/grillo_01.wav",
 "C:/SUONI/trenino_1K_44k1.wav"   
 //"https://sites.google.com/site/musicafilemp3/musica-casuale/Brano2.mp3",
 //"https://sites.google.com/site/musicafilemp3/musica-casuale/Brano3.mp3",
 //"https://sites.google.com/site/musicafilemp3/musica-casuale/Brano4.mp3",
 //"https://sites.google.com/site/musicafilemp3/musica-casuale/Brano5.mp3",
 //"https://sites.google.com/site/musicafilemp3/musica-casuale/Brano6.mp3"
];
var rotazione = Math.random()*music_clip.length;
var numero = Math.floor(rotazione);
document.write('<audio controls="true" autoplay="autoplay">');
document.write('<source src='+music_clip[numero]+' type="audio/mpeg">');
document.write('</audio>');

document.write(numero);}
      </script>

Ciao,

come mai quando viene richiamata la funzione "start" dal botttone "get started"

si apre un nuova pagina con il player?

come posso evitarlo ?

Grazie a tutti

 

[Max 1]

@fazbit
Da regolamento del forum, come tutti noi sei tenuto ad usare il tag

quando posti del codice, oppure la funzione codice dalla barra degli strumenti

Inoltre ti prego di leggere attentamente il regolamento generale del forum e quello di sezione dove posti
Grazie
Per questa volta te lo sistemo io ma mi raccomando per il futuro

 

[fazbit]

@fazbit
Da regolamento del forum, come tutti noi sei tenuto ad usare il tag Vedi l'allegato 5727 quando posti del codice, oppure la funzione codice dalla barra degli strumenti
Vedi l'allegato 5728
Inoltre ti prego di leggere attentamente il regolamento generale del forum e quello di sezione dove posti
Grazie
Per questa volta te lo sistemo io ma mi raccomando per il futuro

ok grazie