Brandhændelse, når brugeren er inaktiv - CSS-tricks

Anonim

Se de to kommenterede linjer nedenfor, det er her, du kan indsætte kode for ting, der skal gøres, når brugeren går inaktiv, og når brugeren kommer tilbage. Indstil tomgangsperioden på tredje linje, 1000 = 1 sekund.

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)

Dette fungerer ved at bruge en setTimeout-funktion til at affyre i slutningen af ​​de angivne sekunder. Hvis der stort set sker noget i løbet af denne tid (musen bevæger sig, siden rulles eller der trykkes på en tast) nulstilles timeoutperioden.