大家有没有注意到，我BLOG右侧的一个CD样式的播放器，很简单，几百行代码，不过花半天时间随便写的，不过它还是有别于一般的播放器。

首先，这个播放器在交互上没什么创新，就是从百度首页“抄”过来的，甚至连CD旋转的CSS3都是原原本本copy下来的，唯一的创新点在于解决网页上播放与页面跳转的冲突问题：

传统的音乐播放器有3种方式：

1、默认的嵌入页面，页面切换到中断

2、默认的嵌入页面，子页面在新窗口中打开

3、在嵌入播放器的页面同时，弹出一个最小化的小窗口，这个窗口做真正的播放，父页面上做播放的UI交互。

不管是多么复杂的方式，最终都不得不为了解决页面跳转与播放中断的矛盾，使原本简单的方式越来越复杂。

本站的播放器，折衷了复杂性与方便性，对播放器做了一个“记忆”功能，让原来很普通的播放器变更更“智能”。

核心代码：

$(window).bind('unload',function(){
    //页面卸载时 保存当前进度
    if('sessionStorage' in window){
        if(_this.$wrap.find('.player-wrap').hasClass('playing')){
            sessionStorage['currentTime'] = _this.player.currentTime;
        }else{
            sessionStorage['currentTime'] = 0;
        }
    }
});
//对象创建时，加载状态及进度
if('sessionStorage' in window && sessionStorage['currentTime'] && sessionStorage['currentTime']!=0){
    _this.play(sessionStorage['currentTime']);
}

完成的源码:

CSS: http://7jpsyb.com1.z0.glb.clouddn.com/script/mp3player/style/mp3player.css

JS: http://7jpsyb.com1.z0.glb.clouddn.com/script/mp3player/script/mp3player.js