Feuerereignis, wenn der Benutzer inaktiv ist - CSS-Tricks

In den beiden kommentierten Zeilen unten können Sie Code einfügen, um Dinge zu tun, die zu tun sind, wenn der Benutzer inaktiv ist und wenn der Benutzer zurückkommt. Stellen Sie die Leerlaufzeit in der dritten Zeile auf 1000 = 1 Sekunde ein.

idleTimer = null; idleState = false; idleWait = 2000; (function ($) ( $(document).ready(function () ( $('*').bind('mousemove keydown scroll', function () ( clearTimeout(idleTimer); if (idleState == true) ( // Reactivated event $("body").append("
Welcome Back.
"); ) idleState = false; idleTimer = setTimeout(function () ( // Idle Event $("body").append("
You've been idle for " + idleWait/1000 + " seconds.
"); idleState = true; ), idleWait); )); $("body").trigger("mousemove"); )); )) (jQuery)

Dies funktioniert mithilfe einer setTimeout-Funktion, die am Ende der angegebenen Sekunden ausgelöst wird. Wenn während dieser Zeit im Grunde etwas passiert (die Maus bewegt sich, die Seite wird gescrollt oder eine Taste gedrückt), wird die Zeitüberschreitungsperiode zurückgesetzt.