I have a 100% valid html5 document, on every other browser on every OS, there are no problems, but on IE9, I always just get the black rectangle with a red cross on it instead of audio player. I thought that it might be conflicting somehow with the activeX.
Thanks.
<audio controls="controls">
<source src="/files/NRUPPLYSNINGEN_XTRA.mp3" type="audio/mp3">
<source src="/files/NRUPPLYSNINGEN_XTRA.wav" type="audio/wav">
<source src="/files/NRUPPLYSNINGEN_XTRA.ogg" type="audio/ogg">
Your browser does not support this audio format.
</audio>
Maybe a silly question, but could it be that the path to the audio files are not correct?
Chrome renders the audio player nicely even if the audio files cannot be found. However, IE9 does not seem to do that.
If I replace the audio file with a working one then the cross goes away and everything works fine.
<audio controls="controls">
<source src="http://open.is/jQueryMusicPlayer/betty.mp3" type="audio/mp3">
Your browser does not support this audio format.
</audio>
Try it: http://jsfiddle.net/PFTaN/
Related
The WAV format html5 does not work in the single audio tag. I have not tried to convert it to mp3 for what I have to do for it. I did not try to translate it to ogg.
<audio controls>
<source src="horse.ogg" type="audio/">
<source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
To play a wav file you would use the audio/wav type.
So, adding a tag like this:
<source src="horse.wav" type="audio/wav">
However, .wav files don't work natively in IE.
See here: https://developer.mozilla.org/en-US/docs/Web/HTML/Supported_media_formats
If you tried the above tag, and it isn't working in a non-IE browser, you may also have to set a mime-type on your web server to stream it.
I have a HTML5 audio player on my website, it is not working, however it works in all browsers except chrome.
<audio controls>
<source src="http://www.mywebsite.com/path/2015-09-27.mp3" type="audio/mpeg">
</audio>
However a week or more ago the audio files did work, and I didn't change anything, they just stopped being able to be played.
I had the same problem with a mp3 file. I converted the *.mp3 file to *.ogg (e.g. with Audacity) and added a second source to the audio tag:
<audio controls>
<source src="file.mp3" type="audio/mpeg">
<source src="file.ogg" type="audio/ogg">
Your browser does not support the audio element.
</audio>
Now everything works fine.
(found at W3Schools)
I have a simple site which I want to play audio on iPhone safari. It has only the following code:
<audio style="height:77px;" controls>
<source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
Note the src is local. This does not play the audio
However if I change the source to something external such as this...
<audio style="height:77px;" controls>
<source src="http://www.w3schools.com/html/horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
It works perfectly.
It's worth pointing out both methods work fine on desktop, on iPhone only the external src works.
Any ideas for why this may be happening?
I cannot figure out how to incorporate ogg files into a playlist for an HTML5 tag. Right now I read files from a directory JSON object that formats as follows:
var playlist = [{"url":"mp3\/122911.mp3","title":"122911"},
{"url":"mp3\/100909.mp3","title":"100909"},{"url":"mp3\/011110.mp3","title":"011110"},
{"url":"mp3\/061207C.mp3","title":"061207C"},{"url":"mp3\/110309.mp3","title":"110309"},
{"url":"mp3\/120409.mp3","title":"120409"},{"url":"mp3\/031608.mp3","title":"031608"},
{"url":"mp3\/100609C.mp3","title":"100609C"},{"url":"mp3\/120408.mp3","title":"120408"},
{"url":"mp3\/012908.mp3","title":"012908"},{"url":"mp3\/032107.mp3","title":"032107"}]
that works wonders and loading the ogg files into that object is not the issue. I just need to know how to tell firefox that the ogg files are there. Is there a parameter I'm missing in order to do that along with 'url' and 'title' in the JSON? I know it can go right in the audio tag if I'm just creating everything statically, but I'm not. The audio tag is simply:
<audio class="aud" autoplay>
<p>Your browser doesn't support HTML 5 audio.</p>
</audio>
and it works just fine with the mp3s in chrome and safari so far. I know I'm missing something simple. I have the ogg files, just confused about the parameters in the playlist I suppose. Thanks!
How this is working?
<audio class="aud" autoplay>
<p>Your browser doesn't support HTML 5 audio.</p>
</audio>
There is no source. Are you dynamically adding <source> to the <audio>?
Let me tell how it works:
You can specify multiple <source for the <audio>. Browsers will look top to bottom in the <source>s and try to play the first one it supports. So, if you write this way:
<audio class="aud" autoplay>
<source src="music.mp3" type="audio/mpeg">
<source src="horse.ogg" type="audio/ogg">
<p>Your browser doesn't support HTML 5 audio.</p>
</audio>
This will be sufficient. Browses, that support mp3, will use the first source. If the browser, like firefox, that does not support mp3 will discard this and look next. It will find .ogg next and will play that one.
You can see more here:
http://www.w3schools.com/html/html5_audio.asp
I have a web site and I want to link a button to a video. So whenever someone clicks the "video" buttons let's say, I want to open the video.mp4 in a new browser. What I do is:
<div>...</div>
The video is quite big (190MB) so the code above is not working. I start listening to the sound but cannot see the image.
Does anyone know how to do it? Or any simple way to just open this video as a link?
You could use HTML5 tag don't forget that MP4 is only supported by IE 9+, Chrome 5+ and Safari 3+. You should at least convert your file to WebM or Ogg to make it compatible with all recent browsers.
To do so you would need a new page (where the link goes) and in this page have this code:
<video width="320" height="240" controls="controls">
<source src="movie.ogg" type="video/ogg" />
<source src="movie.mp4" type="video/mp4" />
<source src="movie.webm" type="video/webm" />
Your browser does not support the video tag.
/* instead of the last line you could also add the flash player*/
</video>
The browser will automatically select the first known format and play it. (source: w3Schools.com)
Hope this helps!