みかづきブログ その3

3ヶ月つづけてみました。

ページからフォーカスが離れた際に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

blur と focus でBGM を 再生したり止めたりする - js do it

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



今回は以上です。