<audio> elements not working on WordPress - audio

I have a small WordPress site. I do a lot of audio work and I'm trying to post HTML5 audio clips in blog entries on WordPress. For some reason it isn't working. It might have something to do with the style I'm using on my WordPress site but I haven't been able to nail it down. I know my audio tags are valid, as they work elsewhere.
Here's an example audio tag:
<audio src="http://files.dannystewart.com/dom2008.mp3"></audio>
And here's a page demonstrating it not working:
http://www.dannystewart.com/html5-audio-test/
I'm quite sure this is something very simple that I've just missed, but any pointers would be appreciated.
Thanks!

You seem to be missing the controls attribute. This made it all work in Chrome for me:
<audio src="http://files.dannystewart.com/dom2008.mp3" controls></audio>
Note it won't work in Firefox - it doesn't support MP3 files. See http://adactio.com/journal/1669/ for a possible solution. As of December 2013, Firefox supports MP3 on Windows (XP+), Linux, Android, FirefoxOS, but not MacOS (bug). See https://developer.mozilla.org/en-US/docs/HTML/Supported_media_formats#Browser_compatibility.

Cool sound!
The problem is your doctype: html5 allows <!DOCTYPE html> only. Which is not to say that browsers won't support html5 elements with other doctypes...but YMMV.

Related

Audio .MP3 not working in Safari browser

I am developing web application where i have to use play sound where i used .MP3 but its issue occur.
Sound play good in chrome, Firefox but in safari its not working.
<audio id="myAudio"><source src="/assets/noti.mp3" type="audio/mpeg"></audio>
I have no idea and did not find anywhere so I asked here.
Hope and waiting for your response.
Thanks in advance.
I had also problems with mp3 file on safari and after a lot of research it was problem with the compression of the file.
I had the same problem, but I had urls like /listen/123.
Notice that it has no extension.
I was streaming the file, so the link worked in chrome + firefox.
So I've added an extension to the url (listen/123.mp3) and modified my back-end code so that 123.mp3 would actually load the resource 123.
And it worked.
I had the same problem and I was able fix the corrupted mp3 file with the open source tool MP3val. The problem which this tool fixed was "Garbage at the beginning" of the file. Now the sound works also on Safari.

cross domain mp3 opera extension

I'm having trouble playing mp3 files served from a remote domain in an Opera extension. I'm using jPlayer. Is it at all possible to play mp3 from another domain in Opera. Because as far as i know Opera only supports mp3 in flash, but flash probably has some cross domain restrictions. So if it is possible what steps should I take and how to make jPlayer (or maybe an alternative player) work in Opera?
Actually, I've never played with that but have you tried to apply the policy file? http://kb2.adobe.com/cps/142/tn_14213.html
will this make the following code stream instead of just downloading?
<td style="text-align: left;" valign="top"><a href="test-clip.mp3">

playing mp3 audio file in firefox browser

I have searched for various articles about playing mp3 files in firefox but no luck.
I want something similar to this website for playing my audio files:
http://www.waatea603am.co.nz/podcasts
Can anyone tell me how is the audio files being played in the website. I want to do something similar. I cant figure out how it is being done.
Thanks
Here's the JavaScript that makes the links play sound:
http://www.waatea603am.co.nz/Resources/JavaScript/podcast-audio.js
It's basically using the HTML5 Audio element:
<script type="text/javascript">
var snd = new Audio("file.mp3"); // buffers automatically when created
snd.play();
</script>
http://www.w3.org/wiki/HTML/Elements/audio
This isn't really a "programming" question, as much as a "Firefox configuration" question.
Personally:
I don't really have any preferences of "media player" for Linux
I simply use Windows media player for Windows
Windows Media player comes built in with all recent versions of Windows
Windows media is the default file association for .mp3 on all recent versions of Windows
Consequently, Firefox automatically uses Windows Media player to play .mp3's
Here's more info:
Issues:_Sound">http://kb.mozillazine.org/Mozilla_Suite_:Issues:_Sound
http://support.mozilla.org/en-US/kb/fix-common-audio-and-video-issues
'Hope that helps .. PSM
PS:
Unfortunately, most commercial Internet radio stations seem to use Flash to broadcast audio streams. Sigh...

Easiest way to sound of an audio file for notification purposes on a website?

It has to work on IE8 and above, and the rest of the modern browsers (Firefox, Chrome, Opera).
Related question:
How to play a notification sound on websites?
I've tried using the Yahoo! Media Player, but it refuses to pick up on my .mp3 links despite them looking like:
<a id="wolf-blue" href="/Public/audio/wolf.mp3">a</a>
Assuming I have a .mp3 file and I want to play it when a timer reaches 0, what do you suggest I use to play this sound file? I do not want to show my users any sort of player UI, just play the sound.
You'll want to check out jPlayer. It's an HTML5 Audio player that has fallback to Flash for browsers that don't support HTML5.
You can use CSS to completely customize the player, including hiding it from view.

Video format that wouldn't require a browser plugin

What is the recommended (cross-browser) video format to use on websites so that users' browsers (or most of them) wouldn't require to download a plugin to view it?
There is no single video that will play in every browser. If you want it to work across the most browsers, you're going to have to encode your video more than once. Dive into HTML5 video has the gory details.
You nest your video references so that browsers try these in order, falling back if it's not supported:
Ogg Theora
MP4 H.264
A Flash container displaying #2
Number 1 gets you Firefox 3.5 and Chrome. Number 2 gets you Safari and the mobile phone WebKit browsers. Number 3 gets you IE, Firefox ≤3, and Opera.
There is no such format available yet. The best way to go is:
Flash (most of the users have flash plugin installed already, 99% according to http://www.adobe.com/products/player_census/flashplayer/)
OGG (This will be available in HTML5 as standard)
Yes HTML5 will solve some of the problems of not needing a plugin, but different browser vendors have chosen different codecs and file formats. It's complicated, but Dive Into HTML 5 has a great article.
None! but you can do it with HTML 5 which is not implimented by all browsers ...
if you really need a video on your page i would recommend flash or silverlight
In a couple of months HTML 5 will be supported by almost all browsers on this planet. If you are planning to run your services in 2010 just use OGG open standard container format. It is unrestricted by software patents and is designed to provide for efficient streaming and manipulation of high quality digital multimedia. It is already supported by Firefox 3.5 and soon all browsers will support it.
Please look at documentation and wiki on http://www.xiph.org/ogg/
A giant GIF. (You could attach a Javascript image preloader script to the movie to load it.)
Microsoft Video Codec VC1

Resources