ページからフォーカスが離れた際にBGMを止める

最近、BGMが流れるウェブページが増えてきていますが、ページを離れた際にはBGMを止めるという気遣いがあるとGoodだと思います。個人的には。

そんな細かい気遣いのできるページをつくるには、blurイベントでaudioをpuseしてしまえばOKです。

JavaScript

(function(win, doc) {
    
    "use strict";
    
    var audio = doc.getElementById("audio");
    audio.play();

    win.addEventListener("blur", function() {
        audio.pause();
    }, false);

    win.addEventListener("focus", function() {
        audio.play();
    }, false);
    
})(this, document);

DEMO

jsrun.it

※ PC版Chromeでご観覧ください。

今回は以上です。