Super easy audio player with Flash + jQuery
I am trying to make an super easy audio player with jQuery.
How would you convert this
<a href="song.mp3">Song</a>
to this?
<object type="application/x-shockwave-flash" data="dewplayer.swf" >
<param name="flashvars" value="mp3=blank.mp3" />
</object>
<a href="song.mp3"开发者_高级运维>Download</a>
So what needs to happen as I understand it
- The name of the link is changed to Download
- the flash object code is pasted before the link,
- the mp3 urls are stored,
- each respective mp3 url are inserted into each corrolating value="mp3=____"
This utilizes a simple flash audio player, Dewplayer.
Any thoughts?
Like this (untested):
// on document ready,
$(function ()
{
var objTagOpen = '<object type="application/x-shockwave-flash"'
+ ' data="dewplayer.swf">'
+ '<param name="flashvars" value="mp3=',
objTagClose = '" /> </object>';
// find all the links whose href ends with '.mp3',
// and for each one,
$('a[href$=.mp3]').each(function ()
{
var $this = $(this);
// insert the flash <object> with the flashvars parameter
$this.before(objTagOpen + $this.attr('href') + objTagClose);
// then rewrite the link itself
$this.text('Download');
});
});
super-easy indeed.
Edit: Pekka's absolutely right about using a rel
to allow you to have normal mp3 links as well. In that case, all you need to do is rewrite your initial selector, from
$('a[href$=.mp3]')
to
$('a[href$=.mp3][rel=mp3]')
精彩评论