web-dev-qa-db-ja.com

ブラウザのタブで通知を点滅させる

セキュリティ上の理由から、私のWebサイトは5分間何も操作しないと自動的にユーザーをログアウトさせます。これは、ユーザーが「アクティビティ」と見なすものをユーザーが実行するたびにリセットされるjqueryタイムアウトを通じて実現します。セキュリティを確保するために、Cookieのタイムアウトも5分に設定され、jqueryはサーバーにハートビートを返し、Cookieが期限切れにならないようにします。

現在、約4分の非アクティブで、jquery uiダイアログがポップアップし、ユーザーにタイムアウトが迫っていることを警告しています。ユーザーはサインインしたままにするか、今すぐサインアウトするか、何もせずに5分間の終わりにサインアウトするように選択できます。

私の問題は、ユーザーが注意を払っていない間に何かが起こっていることをユーザーに警告するために、タブを異なる背景色で点滅/点滅させたいことです。これをどうやってやればいいのかわからない。

jquerytabsbrowsernotifications
24
Josh

ページのタイトルを変更できます（これにより、タブのテキストも変更されます）。

document.title = 'New title';

さらに、ページタイトルとユーザーに表示しようとしている情報の間のsetIntervalでこれを行うことができます。チャット通信が着信するGmailでこの動作を確認しました。

24
Josiah Ruddell

ブラウザのタブの背景を変更することはできません。少なくとも、一貫してではありません。

Josiahが述べたように、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/

17
Curt

alertウィンドウを追加することもできます。ユーザーが別のタブにいる場合、ブラウザーには、タブをフラッシュする（アラートがある）機能が組み込まれています。したがって、アラートとともにドキュメントのタイトルを変更すると、目的に役立ちます。注：アラートを表示する前に、まずタブがアクティブかどうかを確認する必要があります。

1
Parish

ページのタイトルを変更すると、ブラウザのタブに表示されますが、背景色を変更したり、点滅させることはできません

1
hunter