3

Chrome 中有一个功能 - 您可以右键单击选项卡并选择“固定选项卡”，然后选项卡移动到左角，看起来像一个带有文本的图标。

所以有一个问题：如何突出显示此选项卡？也许有一些API？

例如，gmail 可以在收到新邮件时突出显示此选项卡。

谢谢你。

4

2 回答 2

5

您不能闪烁选项卡，只能闪烁选项卡标题：

<script>
function blinkTitle() {
 if(!window.oldtitle) window.oldtitle = document.title;
 if(document.title == ' ') {
  document.title = window.oldtitle;
 } else {
  document.title = ' ';
 }
}
function startBlink() {
 window.blinkinterval = setInterval(blinkTitle,200);
}
onload = function() {
 document.onblur = function() {
  setTimeout(startBlink,2000);
 }
 document.onfocus = function() {
  clearInterval(window.blinkinterval);
  document.title = window.oldtitle;
 }
}
</script>
于 2010-10-26T21:40:21.123 回答
2

这是一个在 10 秒后更改页面标题的 HTML 页面：

<html>
   <head>
      <script>
         function blinkPinnedTab()
         {
            var title = document.title;
            var newTitle = "New Message";

            window.setTimeout(function()
            { 
               document.title = newTitle;
               window.setTimeout(function()
               { 
                  document.title = oldTitle;
               }, 1000);
            }, 1);
         }

         window.setTimeout(function() { blinkPinnedTab(); }, 10000);
      </script>
      <title>Yo, Yo!</title>
   </head>
   <body>
      Hello!
   </body>
</html>

要查看“突出显示动画”，请执行以下操作：

  1. 加载页面。
  2. 固定选项卡。
  3. 切换到不同的选项卡。（因为如果选项卡是活动选项卡，则不会发生任何事情。）
  4. 在加载页面的 10 秒内，该选项卡将被“突出显示”。

您必须在 10 秒内完成步骤 2-3 才能看到效果。如果你没有，那么只需重新加载页面并快速切换到不同的选项卡。

编辑：我仍然认为 charles.art.br 的答案同样好（实际上，它更好）。我们提供的代码示例之间几乎没有区别。老实说，我不知道为什么他的回答没有被接受。

于 2010-11-15T07:42:06.023 回答