Geek Answers Handbook

HTML5 Audio object not playing in Safari

In my page , I dynamically create an HTML5 Audio element in JavaScript:

bell = new Audio("alarmclock.mp3");

Later (in response to the expiration of the jQuery countdown object) I reproduce it:

 bell.play();

Results:

  • Chrome (6.0.472.55) for Mac: Sound plays normally.
  • OmniWeb (5.10.2): the sound plays normally.
  • Safari (5.0.1) for Mac: I hear nothing. The sound is playing great. (I do not know why it did not work before.)
  • MobileSafari (iOS 3.1.3 - latest version for my device): I don’t hear anything.

How can i solve the problem? I would really like it to work in MobileSafari, so my web application can be portable.

+4
source share
2 answers

About iPhone Safari: it seems that play () works when the onclick event is fired. See http://groups.google.com/group/iphonewebdev/browse_thread/thread/91e31ba7ae25e6d4?hl=en

+3
source

Good question: "How can I solve the problem?". Here is my attack plan ...

  • Debugging with Safari on Mac; if you earn there, then go over the test with MobileSafari, since the latter hurts more.
  • Start with a blank page. Insert the HTML5 audio element with this MP3 file statically (not via JavaScript).
  • Keep working with your minimal page. Use jQuery $(document).ready(function () { /* ... */ }) to load the audio onto the page load. Is he still working?
  • OK, try adding the countdown logic to the demo page - as little as possible. Did this cause a problem?
  • If you have reached this point and are still working on your demo page, you know that this will be something about all the other complex things on your site, and not a problem with audio or even dynamically loaded sound. In this case, good luck: -S. Either add things to your blank page, check each time, or temporarily remove them from the original page until it works. Then you will find out what caused the problem.
+3
source

More articles:


All Articles