html5,定制<audio>需注意的事项

现在我写的这个，不能拖动进度条，不能切换上下的audio

1.播放按钮的变化，2个播放/暂停的图片。

$('.audio-pic').click(function () {
    $(this).toggleClass(function () {
        if ($(this).hasClass("start")) {
            return "pause"
        } else {
            return "start"
        }
    });

})

2.进度条

一个是总的进度条，放在最下面。

一个是当前进度条，覆盖在总进度上面。

一个是当前进度的位置，可以理解为上面的一个小块，放在当前进度条的右边（可有可无）

3.动态进度条

currentTime：设置或返回音频/视频中的当前播放位置（以秒计）

duration：返回当前音频/视频的长度（以秒计）

4.paly pause 两个事件切换

if (audio.paused) {
    audio.play();
} else {
    audio.pause()
    clearInterval(aaa);
}

5.计算时长，监听音频加载完成的状态

durationchange：