le risposte semplici

Immagini con audio

Per verificare i vostri codici, prima di inserirli, potete usare l'HTML editor.

Audio al passaggio del mouse



NOTA: il tuo browser potrebbe bloccare l'audio per le impostazioni di sicurezza.


Codice:
<div class="audio-container">  
<a href="" onmouseover="playclip();"><img id="hoverElement" src="URLimmagine" border="0" alt=""></a>    
<audio id=audio >
<source src="file.mp3" type='audio/mpeg; codecs="mp3"'>
<source src="file.ogg" type='audio/ogg; codecs="vorbis"'>
</audio>
</div>
<script>
var hoverArea = document.getElementById('hoverElement');
var audio = document.getElementById('audio');
hoverArea.onmouseover= function(){
audio.play();}
hoverArea.onmouseout= function(){
audio.pause();}
</script>

Al posto di "file.mp3" mettete l'indirizzo del file audio.
Per essere sicuri che l'audio sia supportato su diversi dispositivi, potete caricare sia il formato.ogg che il formato .mp3
Al posto di "URLimmagine" mettete l'indirizzo della vostra immagine.

Tenete presente che l'evento "onmouseover" non e` sempre supportato dai browser dei dispositivi mobili, mentre l'evento "onclick", in genere, e` supportato.

Audio al click del mouse



Codice:
<div class="audio-container">
<img src="URLimmagine" border="0" value="PLAY"  onclick="play()">
<audio id=audio >
<source src="file.mp3" type='audio/mpeg; codecs="mp3"'>
<source src="file.ogg" type='audio/ogg; codecs="vorbis"'>
</audio>
</div>
<script>
function play(){
var audio = document.getElementById("audio");
audio.play();}
</script>
Fammi sapere se questo argomento ti è stato utile.
Se non lo è stato, puoi inviarmi le tue osservazioni. Grazie 
Continua con: