First here is my code:
(function(a,n){
window.onload = function() {
var b = document.body,
userAgent = navigator.userAgent || navigator.vendor || window.opera,
playSound = function(file) {
var mediaAudio = new Audio(file);
mediaAudio.play();
};
if(b.id == 'fail' || b.id == 'success')
{
if ((/android/gi.test(userAgent) && !window.MSStream))
{
var vm = document.createElement("video"), type;
vm.autoPlay = false;
vm.controls = true;
vm.preload = 'auto';
vm.loop = false;
vm.muted = true;
vm.style.position = 'absolute';
vm.style.top = '-9999%';
vm.style.left = '-9999%';
vm.style.zIndex = '-1';
vm.id = 'video';
if(b.id == 'fail')
type = a;
else
type = n;
for(key in type)
{
if(/video/gi.test(key) && vm.canPlayType(key) == 'probably') {
vm.type = key;
vm.src = type[key];
b.appendChild(vm);
setTimeout(function(){
vm.muted = false;
vm.play();
},100);
return;
}
}
}
else
{
var au = new Audio(),type;
if(b.id == 'fail')
type = a;
else
type = n;
for(key in type)
{
if(/audio/gi.test(key) && au.canPlayType(key) == "probably") {
playSound(type[key]);
return;
}
}
}
}
}
}({
'audio/mpeg':'./sfx/not_ok.mp3',
'audio/wav':'./sfx/not_ok.wav',
'audio/ogg':'./sfx/not_ok.ogg',
'video/mp4; codecs=avc1.42E01E,mp4a.40.2':'./sfx/not_ok.mp4',
},
{
'audio/mpeg':'./sfx/ok.mp3',
'audio/wav':'./sfx/ok.wav',
'audio/ogg':'./sfx/ok.ogg',
'video/mp4; codecs=avc1.42E01E,mp4a.40.2':'./sfx/ok.mp4',
}));
I'm trying to play background sound on all devices on one special page. That page play fail or success sound.
All works great on desktop browsers but when I try to play on mobile, I not get results. In that code you see above, I add one hack where I on android platform generate hidden video and trying to autoplay but not have success.
Is there a way how I can trigger play for video or audio automaticaly?
Is there a way to emulate some click event on body to automaticaly play sound on click event or some other solution?
Friends, you must be using a smartphone only then you are reading this article. You must know about normal ringtones but you do not know how to make your own name DJ ringtone? Friends, not everyone likes the same ringtone, he keeps changing the ringtone of his favorite from time to time in his phone. That's why there is always a search for a new dzwonki na telefon.
I doesn't know if it works for mobile, but the plain html5 audio tag has an autoplay attribute.
<audio controls preload="auto" autoplay>
<source src="./sfx/ok.ogg" type="audio/ogg">
<source src="./sfx/ok.mp3" type="audio/mpeg">
<source src="./sfx/ok.wav" type="audio/wav">
<source src="./sfx/ok.mp4" type="video/mp4; codecs=avc1.42E01E,mp4a.40.2">
Your browser does not support the audio element.
</audio>
heh, I also once had trouble getting audio right. That's why I decided against JS APIs, and instead use HTML to set up an HTML5 audio tag and an older object tag. If the new API for playing sound is available, I just execute that on the audio tag, else I use the object tag to play sound.
<audio class="js-audio-new"> <source src="horse.ogg" type="audio/ogg"> <source src="horse.mp3" type="audio/mpeg"> </audio>var audioNew = document.querySelector('.js-audio-new'); // <- might use jQuery for older browsers here if (audioNew.play) { audioNew.play(); } else { audioNew.innerHTML = '<embed src="' + audioNew.attributes.src.value + '" autostart=true loop=false volume=100 hidden=true></embed>'; }