Audio标签自定义实现悬浮播放

1.起因

audio标签自带的controls样式单一，不能很好的适配项目主题样式及风格，需要进行美化。

2.站在巨人肩上

借鉴GitHub现有AudioJS插件，插件实现了基本的播放控制，包括进度条，为了进一步精简，修改配置如下：

$(document).ready(function() {
            var settings = {
                progressbarWidth: '0px',
                progressbarHeight: '0px',
                progressbarColor: '#22ccff',
                progressbarBGColor: '#eeeeee',
                defaultVolume: 1
            };
            $(".player").player(settings);
        });

3.改造

添加鼠标悬浮事件

 button.hover(function() {
			        simplePlayer.play();
			        $(this).find('.player-play-control').addClass('player-stop-control').removeClass('player-play-control');
			  
			});

4.简单改造前后的效果

（支持鼠标悬浮操作）