Faire flash de l'onglet Navigateur une notification
pour des raisons de sécurité, mon site enregistre automatiquement les utilisateurs après 5 minutes d'inactivité. J'y parviens grâce à jquery timeouts qui sont réinitialisés chaque fois que l'utilisateur fait ce que je considère une "activité". Pour assurer la sécurité, le délai d'expiration du cookie est également fixé à 5 minutes, et mon jquery effectue un heartbeat de retour vers le serveur pour s'assurer que le cookie n'expire pas.
actuellement, à environ 4 minutes d'inactivité, un dialogue jQuery ui apparaît, avertissant l'utilisateur de leur imminente délai d'attente. L'utilisateur peut choisir de rester connecté, connectez-vous dès maintenant, ou ne rien faire et ils sont contraints de signer à la fin des 5 minutes.
mon problème est que je veux faire clignoter l'onglet flash / blink avec une couleur de fond différente pour avertir l'utilisateur que quelque chose se passe alors qu'ils ne faisaient pas attention. Je ne suis pas sûr de savoir comment aller à ce sujet.
4 réponses
Vous pouvez changer le titre de la page (cela devrait également modifier le texte dans l'onglet).
document.title = 'New title';
en outre, vous pouvez faire cela dans un setInterval aller-retour entre le titre de la page et l'information que vous tentez de montrer à l'utilisateur. J'ai vu ce comportement sur gmail avec chat entrant communication.
il n'est pas possible de changer l'arrière-plan d'un onglet de navigateur, du moins pas uniformément dans tous.
comme Josiah l'a mentionné,setInterval peut être utilisé pour créer un titre de page clignotant.
Ce javascript permet l'utilisation de celui-ci:
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;
}
}
Cela peut être utilisé comme:
PageTitleNotification.On("User logged out!");
Voir mon blog pour plus d'info:
http://curtistimson.co.uk/js/create-a-flashing-tab-notification-page-title/
vous pouvez changer le titre de la page et qui apparaîtra dans l'onglet du navigateur, mais vous ne pouvez pas changer la couleur de fond ou faire clignoter
Vous pouvez aussi ajouter un alerte la fenêtre. Lorsque l'utilisateur est dans un autre onglet, le navigateur a une fonctionnalité intégrée de clignoter les onglets (avoir alerte). Ainsi, changer le titre du document avec une alerte servira votre but. Remarque : avant de montrer alerte , vous devez d'abord vérifier si l'onglet est actif.