0

I want to produce a simple, static HTML file, that has one or more embedded MP3 files in it. The idea is to have a simple mean of listening to specific parts of an mp3 file.

On a single click on a visual element, the sound should start to play; However, not from the beginning of the file, but from a specified starting point in that file (and play to the end of the file). This should work all locally from the client's local filesystem, the HTML file and the MP3 files do not reside on a webserver.

So, how to play the MP3 audio from a specific starting point? The solution I am looking for should be as simple as possible, while working on most browsers, including IE, Firefox and Safari.

Note: I know the <embed> tag as described here, but this seems not to work with my target browsers. Also I have read about jPlayer and other Java-Script-based players, but since I have never coded some JavaScript, I would prefer a HTML-only solution, if possible.

Update: By now this has become a live tool, located at http://quir.li/player.html. I ended up using the excellent mediaplayer.js by John Dyer

Marcel
  • 15,039
  • 20
  • 92
  • 150
  • Why don't you embed your object, and if its using quicktime/flash or whatever, just include the parameter to the plugin so that when they try to use it, it prompts them to install a plugin from the source. – clamchoda Mar 08 '11 at 19:28
  • Ok, this got 2500 views, but no upvotes? – Marcel Nov 17 '15 at 15:05

1 Answers1

2

I'm sorry but I don't think it is possible to skip to a specific position in a track without any form of client-side scripting. It is possible to just play a track without client-side scripting using a link with its target pointing to an iframe on your page.

Eg.

<a href="audioembedded.html" target="myplayer">Play audio</a>
<iframe src="nothingplayingnow.html" name="myplayer"></iframe>

If you'd like to embed the audio file itself into the html document, I think the closest you'd get would be to use the data URI scheme. All the pros and cons are explained nicely in that article.

But all of this is of course possible if you use a bit of client-side scripting. This flash MP3-player lets you skip to certain positions via a javascript interface. The site also has a generator which lets you make your own player interface very easily.

Sorry, but I think you'll have to use at least some javascript to achieve what you're attempting.

mqchen
  • 4,195
  • 1
  • 22
  • 21
  • Thanks for this detailed answer. Due to my limited knowledge I did not bring it to work right now. Would it be possible to set an initial position right in the tag, like so?: – Marcel May 31 '10 at 19:30
  • 1
    I don't think that's possible unfortunately. But if you add an ID attribute to your object (eg. ``), and a button which is your skip-to-position-button, it could work like this: `Skip 1 sec into track`. You'll also need to add `` in your object. – mqchen May 31 '10 at 20:33
  • @mq.chen: I tried to do what you mention in your comment. Unfortunately it still does not work. I seem to have an issue like mentioned here: http://stackoverflow.com/questions/1038668/cross-domain-externalinterface-error-calling-method-on-npobject. However, I can not change the SWF as seems to be required. – Marcel Jun 09 '10 at 18:30
  • Sounds like a security issue. I think the only solution would be to distribute the swf file together with your single html. I suppose it is not possible to include rich media in a single html file while requiring it to work with IE. It would be possible to use the ` – mqchen Jun 10 '10 at 16:54