I am new in Html5 and javascript I want to play audio clip when i open html page and it should be stop after 10 seconds and display message that Audio play successfully.
for simple audio play in html5 as below
<!DOCTYPE html>
<html>
<body>
<audio controls>
<source src="kill_bill.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
<script>
setInterval(function(), 10000);
$.each($('audio'), function () { this.stop(); alert('Audio Stop Successfully'); });
</script>
</body>
</html>
A setTimeout seems more appropriate :
var audio = document.createElement("audio");
audio.src = "sound.mp3";
audio.addEventListener("canplaythrough", function () {
setTimeout(function(){
audio.pause();
alert("Audio Stop Successfully");
},
10000);
}, false);
Example
Put timer/counter on load of JS as it come to 10 seconds call the below function.
Timer
setInterval(Call Below Function, 10000)
Stop Audio
$.each($('audio'), function () {
this.stop();
alert('Audio Stop Successfully');
});
TRY THIS ::::
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>TIMER</title>
</head>
<body>
<audio id="aud" controls autoplay>
<source src="test.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
<script type="text/javascript">
var myaud = document.getElementById("aud");
var k = setInterval("pauseAud()", 10000);
function playAud() {
myaud.play();
}
function pauseAud() {
myaud.pause();
alert('Audio Stop Successfully');
clearInterval(k);
}
</script>
</body>
</html>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With