pulsanti sonori in html5

serenus · 18 Mar 2016

Ciao a tutti,

io vorrei fare in modo che ai 5 pulsanti roll-over della mia barra di navigazione fosse associato un suono wav che si sente al passagio del mouse (e non al clic).
Sarei in grado di ottenere questo risultato con Adobe Flash, ma per i noti motivi perferirei utilizzare il linguaggio HTML5.
Sarà possibile?
Qualcuno mi potrebbe aiutare?
Grazie a tutti e buona giornata.

Max 1 · 18 Mar 2016

Ciao
Ecco qua!

Codice:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Documento senza titolo</title>
<script>
<!--
var html5_audiotypes={
	"mp3": "audio/mpeg",
	"mp4": "audio/mp4",
	"ogg": "audio/ogg",
	"wav": "audio/wav"
}

function createsoundbite(sound){
	var html5audio=document.createElement('audio')
	if (html5audio.canPlayType){
		for (var i=0; i<arguments.length; i++){
			var sourceel=document.createElement('source')
			sourceel.setAttribute('src', arguments[i])
			if (arguments[i].match(/\.(\w+)$/i))
				sourceel.setAttribute('type', html5_audiotypes[RegExp.$1])
			html5audio.appendChild(sourceel)
		}
		html5audio.load()
		html5audio.playclip=function(){
			html5audio.pause()
			html5audio.currentTime=0
			html5audio.play()
		}
		return html5audio
	}
	else{
		return {playclip:function(){throw new Error("Your browser doesn't support HTML5 audio unfortunately")}}
	}
}
var mouseoversound=createsoundbite("hover.ogg", "hover.wav")
-->
</script>
</head>

<body>
<a href="page.html" onmouseover="mouseoversound.playclip()">la mia pagina</a>
</body>
</html>

serenus · 19 Mar 2016

ti ringrazio molto per l'attenzione e la risposta.
Avresti anche la pazienza di specificarmi dove precisare il nome del pulsante e dove il nome del suono in questo codice?.
Grazie in ogni caso Max1

Max 1 · 19 Mar 2016

nome suono

Codice:

var mouseoversound=createsoundbite("hover.ogg", "hover.wav")

Io ho messo questo link

Codice:

<a href="page.html" onmouseover="mouseoversound.playclip()">la mia pagina</a>

Ma ovviamente lo puoi sostituire con un pulsante, richiamando sempre la funzione

Codice:

onmouseover="mouseoversound.playclip()

Cerca

Cerca

pulsanti sonori in html5

serenus

Nuovo Utente

Max 1

Super Moderatore

serenus

Nuovo Utente

Max 1

Super Moderatore

Discussioni simili