关于audio标签暂停的问题

Question

<audio src="res/bg.mp3" id="m1" controls loop></audio>    <input type="checkbox" id="bgm"/>:是否播放背景音乐    <script>        bgm.onchange=function(){            if(this.checked){                m1.volume=0;                m1.play();                var timer=setInterval(function(){                    m1.volume+=0.1;                    if(m1.volume>0.9){                        clearInterval(timer);                    }                },200);            }else{                var timer=setInterval(function(){                    if(m1.volume>0){                        m1.volume-=0.1;                    }else{                        clearInterval(timer);                        m1.pause();                    }                },200);            }        }    </script>代码如上，想要做一个点击checkbox实现背景音乐淡入淡出的小功能，淡入可以实现，但是淡出时，我想要音量变为0时，自动暂停。但是我这个音量变为0之后，进度条仍然在走，m1.pause()没有生效。。实在搞不明白，前端小白，求指导π-π