I need to play few wav files on button click. I found solution working in IE but it requires QickTime plugin for Firefox.
Is there any other way?
<html>
<head>
<script>
function DHTMLSound(surl) {
document.getElementById("dummyspan").innerHTML=
"<embed src='"+surl+"' hidden=true autostart=true loop=false>";
}
</script>
</head>
<body>
<h1>test</h1>
<span id=dummyspan></span>
<input type="button" value="Play" onmouseover="DHTMLSound('1.wav')">
</body>
</html>
Use one of these. I have only use jPlayer and can strongly recommend it.
jPlayer (requires Flash)
Scriptaculous plugin (works without Flash in Firefox)
MooTools (requires Flash)
I'd detect whether the browser allows the audio tag, and use that in that case.
That looks like this:
<audio src="1.wav" autoplay></audio>
Currently Firefox, Safari and Opera can play Wavs, Chrome as of version 3 can't, not sure about 4.
See http://html5doctor.com/native-audio-in-the-browser/ for info on how to detect whether the browser has the audio tag.
You'd then use your existing solution for IE.
<audio> as per Rich's answer is definitely the way of the future. Unfortunately at the moment there is no IE support and to get the other browsers that support it to be happy you have to use both WAV and (OGG or MP3).
So for the moment you may need to provide other ways instead or as-well-as <audio>.
Personally I would strongly avoid <embed>ding a media player plugin. It won't work on browsers without plugins and you might not get a plugin you expect, and the one you get might not work the same as you expect. There is also <bgsound> on IE only, but controlling it can be annoying.
So I'd probably go for a Flash fallback solution for when <audio> isn't available. Flash has much better acceptance than any of the media player plugins.
Unfortunately, it doesn't natively support WAV, so either you use a (typically slow) WAV reader or you go with MP3 and have multiple audio formats to worry about again!
One day this will all work nicely. One day, probably around 2056.
Related
http://www.storiesinflight.com/html5/audio.html
I'm trying to accomplish a sound script from above link, which should play a audio file. The article author claim it's compatible in firefox. But it's not playing in mine. It does however works in Chrome. Tried internet explore and not luck there either.
Are there any obvious reasons for this?
<audio id="audiotag1" src="path.wav" preload="auto"></audio>
Play 5-sec sound on single channel
<script type="text/javascript">
function play_single_sound() {
document.getElementById('audiotag1').play();
}
</script>
IE 11 does not support .wav files, so if you want to support IE you'll have to use either .mp3 or .ogg. As for why it didn't work in Firefox, a problem might be that .wav files are very large so depending on when you clicked on the link the audio file may not have loaded yet.
It's better to use the canplay event so you know when the audio file has loaded and can be played.
var audio = document.getElementById('audiotag1');
audio.addEventListener('canplay', function() {
audio.play();
});
Which version of IE are you testing it on?
IE often lags in terms of support for features.
Check out this chart. Maybe your version of IE doesn't have support for audio.
UPDATE
Adding this meta tag might help
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
Installing MediaPack might help too
Were using .wav, tried with .mp3 and it works in all three browsers.
we have a web application which is targeted to work on Internet Mobile Explorer 6. We need to play a sound when the user inputs an incorrect ... "input". Any idea what is supported on ie mobile 6 and how I can achieve this ?
Thanks in advance.
I know this question is somewhat old, but I think it still deserves an answer. This is how I got it working. If you are only targeting IE6 Mobile, you could so something like the following in your head tag:
<bgsound id="bgSoundId" loop="0" volume="100" />
And then have a JavaScript function like so:
function playSound() {
document.getElementById("bgSoundId").src = "path/to/file.wav";
}
So, then you just call that function from your validation logic.
Try <bgsound> in <embed> in <audio> (to support as much browser, as you could)
<audio src="sound.url" type="mime/type">
<embed src="sound.url" type="mime/type">
<bgsound src="sound.url">
</bgsound>
</embed>
</audio>
But embed & bgsound has no generic way to start playing from javascript, as far as i can tell.
I am working on a project, and my current task is add a feature to listen audio file directly in the web page. What options do I have? All files are mp3, and the page contains about 15 audio files
Unfortunately, the flash player looks like only one possible solution and I just hope if somebody will give me a clue how to make the feature done without it.
Update: Thanks for the direction with audio tag!
The short answer is that native HTML5 audio will not work in all browsers (such as IE6, 7, and 8). Likewise, Flash audio will not work in mobile Safari. Your best bet for a production-grade solution is an audio abstraction framework that will use either HTML5 or Flash-based audio based on the client's browser. Fortunately, there is such a framework, based in jQuery, called jPlayer.
The <audio> tag! Note that different browsers support different compression solutions. Currently OGG Vorbis seems to be the most appropriate format to convert the audio into.
Edit: I seems that some browsers support OGG and some browsers support MP3. If you can, have both versions available and upload both. Then, in the markup have a declaration that looks like this:
<audio controls autobuffer>
<source src="audio.mp3" />
<source src="audio.ogg" />
</audio>
Try the audio tag in html5
http://www.w3schools.com/html5/tag_audio.asp
http://html5doctor.com/native-audio-in-the-browser/
Is it possible to play embedded MP3 on iPad Safari (the way you do on normal desktop browsers) ?
If yes, do we need to code separately for iPad Safari ?
The reason I am asking is bcoz in my app, the desktop code for mp3 is not working on iPad..
The code for desktop is
<EMBED src="'+audioUrl+'" autostart=true loop=false volume=100 hidden=true>
To add to the excellent answers of Blindy and John, the IPad should be HTML5 compliant which means that you can use the HTML5 audio and vido tags. You can read more about this at The Safari Developer Library.
Why don't you just use the <audio> tag, that's what it's there for.
To answer your question, yes it is possible.
You can use the HTML 5 <audio> tag. Check out w3schools - HTML5 Audio.
There is also a table on there telling you what formats work with what browsers.
I currently have a simple flash Mp3 player on my site which works lovely. The issue is, most cell phones do not support flash and a large portion of my visitors come through via a mobile device. The alternative to this is to replace the flash player with a javascript player. I found a JQuery one but it only works on HTML5 compatible browsers. Does anyone know of a good alternative that would work on mobile devices as well as most desktop web browsers?
You can check if the browser supports the HTML5 audio tag if not, use the flash version.
Check out jPlayer.