换个拉风的音乐播放器,咱也文艺一把 » 荒野无灯weblog

Keep It Simple, Stupid.

荒野无灯weblog

换个拉风的音乐播放器,咱也文艺一把

这次的主角是SoundManager 2 / 360° Player
用的 JavaScript + Canvas UI .
而在此之前,我博客一直用的是Audio Player 里的flash播放器播放mp3 ,如之前有文章《不用audio-player插件也播放mp3》等。另外之前尝试过的yahoo webplayer加载上有些慢,因此没有使用它。
HTML的audio 标签目前兼容性还不太好(对后面带中文参数的Mp3url,发现只有IE9下面可正常播放。如我上一篇文章中的例子)。

另外,我之前文章中所用的


形式的内容并不需要做任何调整。因为是short tags实现的缘故,因此,这里可以很方便的把它用另外的形式来展现,这就是WP的强大之处。
我只需要把代码稍微修改一两行,再在主题中加上js和css,整站所有音乐全部会调用这个很cool很简洁的播放器了 :twisted:
另外,我还给短代码添加了一个属性: title 用于显示歌曲的名称。因此,后期的mp3可以用这种方法添加:


并且,前期的内容不受任何影响。


SoundManager 2项目主页:http://www.schillmania.com/projects/soundmanager2/

目前我将此效果集成到我的超级插件包:Hacklog Package里面了,后期如有时间就把它做成个小插件,可以随意选择各种cool的样式~~
当然,如果你现在就想要一个插件,这里我也找到一个:WPaudio MP3 Player


用一首经典老歌来做测试吧(在ff , opera , chrome ,ie 现行版本下测试通过):
点击可播放/暂停,拖动圆环可快进/倒退

梅艳芳 – 似是故人来(低音质版):

高音质版:


我这个是SoundManager 2 / 360° Player,另外还有更给力更cool的,如图:

可到这里亲自体验一把~~

Tagged in :

All Comments (0)
Gravatar image
No Comments