浏览器失去焦点,闪动提示用户

最近发现一个pc端很好玩的东西,当浏览器隐藏的时候,会触发浏览器title变化,从而实现闪动效果;

var titleInit = document.title, isShine = true;

setInterval(function() {
    var title = document.title;
    if (isShine == true) {
        if (/新/.test(title) == false) {
            document.title = '【你有新消息】';    
        } else {
            document.title = '【     】';
        }
    } else {
        document.title = titleInit;
    }
}, 500);

window.onfocus = function() {
    isShine = false;
};
window.onblur = function() {
    isShine = true;
};

// for IE
document.onfocusin = function() {
    isShine = false;
};
document.onfocusout = function() {
    isShine = true;
};

来源:http://www.zhangxinxu.com/wordpress/2016/07/know-html5-web-notification/

你可能感兴趣的:(浏览器失去焦点,闪动提示用户)