使浏览器窗口在任务栏中闪烁

StackOverflow https://stackoverflow.com/questions/37122

  •  09-06-2019
  •  | 
  •  

题

如何使用 JavaScript 让用户的浏览器在任务栏中闪烁/闪烁/突出显示？例如，如果我每 10 秒发出一个 AJAX 请求来查看用户在服务器上是否有任何新消息，我希望用户立即知道，即使他当时正在使用另一个应用程序。

编辑：这些用户确实希望在收到新消息时分散注意力。

有帮助吗？

解决方案

这不会使任务栏按钮闪烁变化的颜色，但标题会闪烁，直到他们移动鼠标。这应该可以跨平台工作，即使他们只是将其放在不同的选项卡中。

newExcitingAlerts = (function () {
    var oldTitle = document.title;
    var msg = "New!";
    var timeoutId;
    var blink = function() { document.title = document.title == msg ? ' ' : msg; };
    var clear = function() {
        clearInterval(timeoutId);
        document.title = oldTitle;
        window.onmousemove = null;
        timeoutId = null;
    };
    return function () {
        if (!timeoutId) {
            timeoutId = setInterval(blink, 1000);
            window.onmousemove = clear;
        }
    };
}());

更新: ：您可能想看看使用 HTML5 通知.

其他提示

我做了一个 jQuery 插件 用于在浏览器标题栏中闪烁通知消息。您可以指定不同的选项，例如闪烁间隔、持续时间、窗口/选项卡获得焦点时是否应停止闪烁等。该插件适用于 Firefox、Chrome、Safari、IE6、IE7 和 IE8。

以下是如何使用它的示例：

$.titleAlert("New mail!", {
    requireBlur:true,
    stopOnFocus:true,
    interval:600
});

如果您不使用 jQuery，您可能仍想查看 源代码 （如果您想完全支持所有主要浏览器，则在进行标题闪烁时需要解决一些奇怪的错误和边缘情况）。

据说你可以使用Windows javascript API的咆哮在Windows上执行此操作：

http://ajaxian.com/archives/growls-for-windows-and-a-web-notification-api

不过，您的用户必须安装咆哮。

最终这将以NotificationAPI的形式成为google gears的一部分：

http://code.google.com/p/gears/wiki/NotificationAPI

因此，我建议现在使用咆哮方法，如果可能的话，退回到窗口标题更新，并且已经在尝试使用 Gears 通知 API 进行工程设计，以便它最终可用。

我的“用户界面”响应是：你确定吗 你的用户 希望他们的浏览器闪烁，或者做 您认为 这就是他们想要的？如果我是使用你们软件的人，我知道如果这些警报经常发生并妨碍我，我会很恼火。

如果您确定要这样做，请使用 javascript 警报框。这就是谷歌日历对于事件提醒的作用，他们可能对此进行了一些思考。

网页确实不是需要了解警报的最佳媒介。如果您正在按照“ ZOMG，服务器下降！”的设计设计。警报，自动电子邮件或向合适的人发送的消息可能会解决问题。

我能想到的唯一方法是在收到消息时执行类似alert('you have a new message') 的操作。如果窗口最小化，这将使任务栏闪烁，但也会打开一个您可能不想要的对话框。

为什么不采用 GMail 使用的方法并在页面标题中显示邮件数量？

有时，用户不想在收到新消息时分心。

                var oldTitle = document.title;
                var msg = "New Popup!";
                var timeoutId = false;

                var blink = function() {
                    document.title = document.title == msg ? oldTitle : msg;//Modify Title in case a popup

                    if(document.hasFocus())//Stop blinking and restore the Application Title
                    {
                        document.title = oldTitle;
                        clearInterval(timeoutId);
                    }                       
                };

                if (!timeoutId) {
                    timeoutId = setInterval(blink, 500);//Initiate the Blink Call
                };//Blink logic

您可能想尝试 window.focus() - 但如果屏幕切换可能会很烦人

您可以更改每条新消息的网页标题以提醒用户。我为浏览器聊天客户端执行此操作，大多数用户认为它运行良好。 

document.title = "[user] hello world";

AFAIK，没有好的方法可以保持一致性。我正在编写一个仅支持 IE 的基于 Web 的 IM 客户端。我们最终使用了 window.focus()，它在大多数情况下都有效。有时它实际上会导致窗口从前台应用程序窃取焦点，这真的很烦人。

这些用户确实希望在收到新消息时分散注意力。

听起来您正在为内部公司项目编写应用程序。

您可能想研究在 .net 中编写一个小型 Windows 应用程序，它添加一个通知图标，然后在收到新消息时可以执行精美的弹出窗口或气球弹出窗口或其他任何操作。

这并不是太难，我相信如果您问“如何显示托盘图标”和“如何弹出通知”，您会得到一些很好的答案:-)

郑重声明，我非常确定（除了使用警报/提示对话框之外）您无法在 JS 中闪烁任务栏，因为这在很大程度上是 Windows 特定的，而 JS 确实不能那样工作。您也许能够使用一些特定于 IE 的 Windows ActiveX 控件，但是您却将 IE 强加给了可怜的用户。不要这样做:-(

许可以下： CC-BY-SA 和 归因
不隶属于 StackOverflow
scroll top