WORKS作品

• Yahoo mediaplayer音乐代码

  2008-04-01

  版权声明：转载时请以超链接形式标明文章原始出处和作者信息及本声明
  http://shipin.blogbus.com/logs/18032457.html
  
  

  对于博客大巴上的用户，我推荐使用Yahoo mediaplayer音乐代码来制作自己的音乐播放器。它是由js脚本控制的，可以和大巴在布局上很好的融合，经测试在各大浏览器上都能够正常使用，而且使用它是非常简单的。相比之前介绍的del.icio.us音乐播放器代码可是带劲多了。

  Yahoo mediaplayer音乐代码由Yahoo! media player提供。这个播放器简直酷毙了，先来看一下使用效果[点击查看]（注意：看效果点歌曲名前面的播放按钮）。
  使用了本效果的博客：http://buhuishangxin.blogbus.com/
  下面是效果截图：
  
  你会发现它由两部分组成，一个是音乐菜单列表，一个是半隐藏的播放器（窗口左面）。
  1.点击歌曲名前面的播放按钮，播放器滑动显示出来并开始播放音乐；
  2.播放器跟随窗口滚动条滚动而变动，并且成半隐藏状态；
  3.播放器能自动识别歌曲来源是否可用，并提供歌曲来源地址和该歌曲在yahoo上的搜索连接；
  4.兼容性非常好，很好的支持中文。
  5.滑出效果非常酷，分两次滑动：歌曲详情和playlist。

  把它使用到博客大巴上也非常简单，只要添加几行代码就可以了。个人觉得这个效果用在博客侧栏比较好，当然用在单独的日志页里也可以。
  这里讲一下如何使用到博客大巴新系统模板的侧栏中：
  1.在后台“模板设置”中的“首页布局”和“内页布局”中，分别给副栏添加一个自定义HTML模块，修改名称为“最近在听的歌”（当然名称依自己喜好修改），点“输入代码”粘贴下面代码并保存；

  <a href="音乐地址1.mp3"></a><span>音乐名称1</span>
  <a href="音乐地址2.mp3"></a><span>音乐名称2</span>
  <a href="音乐地址3.mp3"></a><span>音乐名称3</span>
  <a href="音乐地址4.mp3"></a><span>音乐名称4</span>
  <a href="音乐地址n.mp3"></a><span>音乐名称n</span>

  音乐地址貌似只支持.mp3格式，可以去百度音乐搜索自己喜欢的音乐并把地址引用过来。建议不要把音乐名称放在<a></a>标签之间，如果这样做访问者点击音乐名称后会出现播放器无法播放的bug，会出现'YAHOO.music.WebPlayer.ui'为空或不是对象的错误提示。放在<span></span>中就可以了。

  2.在“blog设置”中的自定义HEADER文本框中粘帖下面代码并保存。

  <script type="text/javascript" src="http://mediaplayer.yahoo.com/js"></script>

  
  这段脚本代码是yahoo直接给出的，你也可以把它下载保存并上传到自己的空间，引用自己的连接地址，这样页面打开速度会快一点。下载：Yahoo mediaplayer音乐代码.

  3.上面两步做好之后就可以点页面看到效果了。当然如果日志中也有mp3音乐连接，也会自动加入播放器音乐列表中。

  
  

  随机文章：

  BOX随时随地文件分享插件 2008-07-05

  我乐动感相册 2008-04-05

  flashinn涂鸦留言本 2008-03-31

  picturetrail动感相册 2008-03-17

  snap shots超链接秀窗效果 2008-03-15

  
  收藏到：Del.icio.us

  
  
  
  
  

  Tags: 外网 时尚型

  引用: