html5，audio音乐播放器

         终于，做了自己原来一直想要实现的事儿，得出的结果是，有些事儿一旦开始做了，那么它就并不是很难。现在的我，正听着自己的播放器放出的《光辉岁月》写这篇周六清晨的博文。写的不是很好，但也请各位前辈担待一下我这个什么都不懂的菜鸟，也希望各位前辈积极地指正我的错误，小弟感激不尽！

       正式内容前，可以先预览一下效果，http://xxyy.ahthw.com//xiaoyu/musicV1.0/Music1.0.html (在这里，再次感谢王哥提供的服务器！)

       本项目主要用到了html5的audio标签以及它所自带的方法和属性，IE9+浏览器兼容。

      关于audio相关的Api请参阅：http://www.w3school.com.cn/tags/html_ref_audio_video_dom.asp

      值得一提的是，在项目中，遇到了这样的一个问题，根据正常的思维，一首音乐播放的流程是这样的：

      点击事件更换audio的src，音乐重新加载,audio.load(),然后播放音乐audio.play()，在然后去获取音乐的总时长，audio.duration，但是这时候获取的时间总设计NaN，这个问题让我纠结了许久，想必也大概能分析出问题的原因，当浏览器去执行的audio.play()的时候，音乐可能还未加载，就已经执行了audio.duration，所以获取到的时间值总是为NaN，再次感谢无痕哥提供的解决方案。通过监听这首歌是否已经播放(canplay)，去获取时间,相关的Api，http://www.w3school.com.cn/tags/av_event_canplay.asp

      解决代码：

MusicPlayer.addEventListener('canplay',function(e){
        $AllTime.text(makeTime(MusicPlayer.duration));//makeTime是处理把秒处理成00:00格式的函数
        AllTime = MusicPlayer.duration;
    },false);

      其实这个问题，还是由于自己第一次写，经验少，没有仔细查看Api导致的，希望和我一样的菜鸟不会犯和我一样的错误。

      在整体效果中，有一个根据内容的高度和容器的高度对比来添加虚拟滚动条的效果，关于滚动条代码请参考上一篇博文：

      http://www.voidcn.com/article/p-nkqqxtuj-beb.html

      具体的项目代码就不在这里一一体现，有兴趣的朋友可以加我QQ：756500909，或者在线留下邮箱地址，我会把源文件分享给你。希望能一起交流技术和经验！