闪烁标题栏答案

【问题标题】：Flash the title bar闪烁标题栏
【发布时间】：2011-03-09 17:27:01
【问题描述】：

我正在尝试使用非常基本的 HTML 让标题栏闪烁。我试了一下，但下面的代码似乎不起作用，我不知道为什么。另外，有没有办法让标题栏闪烁文本，但前提是用户没有查看当前浏览器页面？

我的尝试：

function Flash() {
            window.setTimeout(function() {
            alert(document.title);
                document.title = (document.title == "Company" ? "Company - flash text" : "Company");
            }, 1000);

            this.stop = function() { 
                document.title = "Company";
                clearTimeout(this.timer);
            }
        }

【问题讨论】：

标签： javascript asp.net html

【解决方案1】：

这个重复make my browser blink as indicator

但既然我现在写了这个脚本：

https://plungjan.name/SO/flashtitle.html

<script>
var timer="";
var isBlurred=false;
window.onblur=function() {
  isBlurred = true;
  timer=window.setInterval(function() {
    document.title = document.title == "Company" ? "Company - flash text" : "Company";
  }, 1000);
}
window.onfocus=function() { 
  isBlurred = false;
  document.title = "Company";
  clearInterval(timer);
}
</script>

jQuery 版本并没有太大的不同（但未经测试）

var timer="";
var isBlurred=false;
$(window).on("blur",function() {
  isBlurred = true;
  timer=window.setInterval(function() {
    document.title = document.title == "Company" ? "Company - flash text" : "Company";
  }, 1000);
}).on("focus",function() { 
  isBlurred = false;
  document.title = "Company";
  clearInterval(timer);
});

【讨论】：

谢谢。有没有办法知道窗口是否失焦（即“isBlur == true”），因为我不需要在每次失去焦点时都闪烁窗口，但只有某些时候。
这个有 jquery 版本吗？
这个和jQuery版本的唯一区别是$(window).on("blur",function() {...}).on("focus",function() {...});

【解决方案2】：

当访问者没有查看当前浏览器页面（窗口隐藏、模糊）时，您询问闪烁（闪烁）document.title 栏。所以我们要设置两个函数。首先，我们需要检测浏览器窗口当前是否处于活动状态 - visibilityChange(actionFunction)。其次，我们需要开始获取闪烁的 document.title 栏 - comeBackAlerts()。你在这里 - 该解决方案对我来说很好，希望对你有用。

/* Set event leaving the page to execute actionFunction */

function visibilityChange(actionFunction) {

  window.focus(); /* window.onfocus = infoIn;  */

  var hidden = "hidden";

  /* Standards: */
  if (hidden in document) {
    document.addEventListener("visibilitychange", actionFunction);
  } else if ((hidden = "mozHidden") in document) {
    document.addEventListener("mozvisibilitychange", actionFunction);
  } else if ((hidden = "webkitHidden") in document) {
    document.addEventListener("webkitvisibilitychange", actionFunction);
  } else if ((hidden = "msHidden") in document) {
    document.addEventListener("msvisibilitychange", actionFunction);
  }
  /* IE 9 and lower: */
  else if ("onfocusin" in document) {
    document.onfocusin = document.onfocusout = actionFunction;
  }
  /* All others: */
  else {
    window.onpageshow = window.onpagehide = window.onfocus = window.onblur = actionFunction;
  }
}


/* Function to make browser window blink in task bar */

var comeBackAlerts = (function() {
  var oldTitle = document.getElementsByTagName('h1')[0].innerText; /* document.title; */
  var msg = "Arbir.ru";
  var intervalId;
  var blink = function() {
    intervalId = setInterval(function() {
      /* document.title = document.title == msg ? ' ' : msg; */
      if (document.title == msg) {
        document.title = oldTitle;
      } else {
        document.title = msg;
      }
    }, 1000);
  };
  var clear = function() {
    clearInterval(intervalId);
    document.title = oldTitle;
    window.onmousemove = null;
    window.onmouseout = null;
    intervalId = null;
  };
  return function() {
    if (!intervalId) {
      blink();
      window.onmousemove = clear;
    }
  };
}());

/* Running the functions */

visibilityChange(comeBackAlerts);

【讨论】：