Сделать вкладку браузера флэш-уведомлением - PullRequest
21 голосов
/ 07 декабря 2010

В целях безопасности мой веб-сайт автоматически отключает пользователей через 5 минут бездействия. Я достигаю этого с помощью тайм-аутов jquery, которые сбрасываются каждый раз, когда пользователь делает то, что я считаю «активностью». Для обеспечения безопасности тайм-аут файла cookie также установлен равным 5 минутам, и мой jquery отправляет контрольный сигнал обратно на сервер, чтобы убедиться, что срок действия файла cookie не истек.

В настоящее время, примерно через 4 минуты бездействия, всплывает диалоговое окно интерфейса пользователя jquery, предупреждающее пользователя об их предстоящем таймауте. Пользователь может выбрать оставаться в системе, выйти из системы или ничего не делать, и он вынужден выйти из системы по истечении 5 минут.

Моя проблема в том, что я хочу, чтобы вкладка мигала / мигала другим цветом фона, чтобы предупредить пользователя о том, что что-то происходит, пока они не обращали внимания. Я просто не знаю, как это сделать.

Ответы [ 4 ]

24 голосов
/ 07 декабря 2010

Вы можете изменить заголовок страницы (это также должно изменить текст на вкладке).

document.title = 'New title';

Кроме того, вы можете сделать это в setInterval назад и вперед между заголовком страницы и информацией, которую вы пытаетесь показать пользователю. Я видел такое поведение в gmail при входящем чате.

16 голосов
/ 04 июня 2014

Невозможно изменить фон вкладки браузера, по крайней мере, не одинаково для всех.

Как упоминал Иосия, setInterval можно использовать для создания вспыхивающего заголовка страницы.

Этот javascript использует его:

var PageTitleNotification = {
    Vars:{
        OriginalTitle: document.title,
        Interval: null
    },    
    On: function(notification, intervalSpeed){
        var _this = this;
        _this.Vars.Interval = setInterval(function(){
             document.title = (_this.Vars.OriginalTitle == document.title)
                                 ? notification
                                 : _this.Vars.OriginalTitle;
        }, (intervalSpeed) ? intervalSpeed : 1000);
    },
    Off: function(){
        clearInterval(this.Vars.Interval);
        document.title = this.Vars.OriginalTitle;   
    }
}

Это может использоваться как:

PageTitleNotification.On("User logged out!");

См. Мой следующий блог для получения дополнительной информации:

http://curtistimson.co.uk/js/create-a-flashing-tab-notification-page-title/

1 голос
/ 07 декабря 2010

вы можете изменить заголовок страницы, который будет отображаться на вкладке браузера, но вы не можете изменить цвет фона или заставить его мигать

0 голосов
/ 17 июня 2016

Вы также можете добавить окно alert .Когда пользователь находится на другой вкладке, в браузере есть встроенная функция мигания вкладок (с предупреждением).Таким образом, изменение названия документа вместе с предупреждением будет служить вашей цели.Примечание. Перед отображением предупреждения необходимо сначала проверить, активна ли вкладка.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...