Der Titel erklärt sich selbst. Wie kann ich feststellen, ob eine Webseite in den Hintergrund gerückt ist?
Ich implementiere eine Chat-Anwendung und werde diese Informationen verwenden, um neue Nachrichtenbenachrichtigungen anzuzeigen. Ich nehme an, dass GMail so etwas benutzt. Wenn sich die Seite im Hintergrund befindet, werden Desktopbenachrichtigungen (in Chrome) angezeigt, wenn sie nicht angezeigt werden.
Ich weiß, dass die Antwort bereits ausgewählt wurde, aber ich wollte einen anderen Weg teilen.
Sie können die hasFocus
-Methode für document
verwenden, um festzustellen, ob sie den Fokus hat. Es gibt keinen Grund, eine eigene Variable festzulegen.
Hier ist ein Beweis für den Konzeptcode. jsFiddle ist am unteren Rand. Alle 3 Sekunden wird überprüft, ob das Fenster den Fokus hat oder nicht - es wird "True" oder "False" angezeigt.
HTML:
%Vor%CSS:
%Vor%Javascript innen auf Dokument bereit:
%Vor%Es gibt jetzt eine API für die Sichtbarkeit der Seite , die von allen Seiten gut unterstützt wird aktuelle Versionen der wichtigsten Browser unter Windows, Mac OS X und Linux (obwohl ich nicht wirklich alle Browser mit einem gerechten Anteil des Linux-Browser-Marktes getestet habe).
Die API für die Sichtbarkeit der Seite ist jetzt der beste Ansatz zum Überprüfen der Sichtbarkeit. die einzigen Vorbehalte sind, dass es Ihnen nicht sagen kann, welche Teile des Browserfensters sichtbar sind (nur dass nichts sichtbar ist oder zumindest ein Teil davon ist) und dass die Unterstützung erst seit 2016 unter Linux, 2015 auf dem Mac und 2014 (möglicherweise früher) unter Windows.
Während der Support ausgerollt wurde, war ein falsches Negativ selten, auf einigen Plattformen traten jedoch falsche Positive auf. Zum Beispiel im Jahr 2014, OSX gerendert Miniaturversionen von minimierten Anwendungen im Dock, und als Folge der Art und Weise dies getan wurde, konnte eine Anwendung nicht leicht sagen, ob es minimiert wurde, da es immer noch aufgefordert wurde, den Bildschirm zu malen. Linux hatte Probleme damit, zu wissen, ob sich Ihre Anwendung in einem nicht sichtbaren Arbeitsbereich befand und ob ein anderes Fenster es verdeckte.
Der erste öffentliche Entwurf wurde im Juni 2011 veröffentlicht und erreichte im Mai 2013 den Status "Empfehlung". Bis März 2014 hatten die neuesten Versionen aller wichtigen Windows-Browser volle Unterstützung für den Standard. Die vollständige Unterstützung für alle wichtigen Mac-Browser wurde im April 2015 erreicht. Linux-Support wurde bis August 2016 mindestens für Chrome erreicht (wenn Chromium Ausgabe 293128 wurde geschlossen); während ich sie nicht getestet habe, erwarte ich, dass andere Linux-Browser wahrscheinlich Schritt gehalten haben, da der schwierigste Teil der Arbeit anscheinend die Anpassung von OS / GUI-Verträgen und APIs war, um herauszufinden, ob Ihre Desktop-Anwendung sichtbar ist.
> Sie können an die Ereignisse window
blur
und focus
binden. Hier ist ein Snippet-Code von einer App, die ich geschrieben habe :
Tags und Links javascript jquery