0

我有一个 html 页面,页面上有几个小窗口(未定义窗口数量)。每个窗口都有.ticking类。.ticking用于 jQuery 的类,用于在用户浏览器上显示服务器时间 +。有些窗口看起来一样,但没有 .ticking 类。在这样的窗口中什么都不会发生。

我想要:

1) 在 15 秒不活动时显示弹出窗口,并从页面上的任何地方删除滴答类

2) 在页面上单击时返回所有内容,即将 .ticking 类返回给拥有它的那些。

任何想法如何做到这一点?

据我了解,我应该将.ticking类重命名为.ticking-sleep一个并重命名.ticking-sleep.ticking用户关闭弹出窗口时。但是,我仍然不知道如何实现这一点以及使用什么事件。

4

1 回答 1

3

我假设用户活动主要包括鼠标移动。您可以在重命名类等的函数上使用 setTimeout。您可以使用 mousemove 处理程序始终将该超时重置为 15 秒。一旦用户停止移动超时函数调用将执行并更改类,显示您的弹出窗口等。

未经测试,但类似这样:

var inactiveTimeout = setTimeout(handleInactiveUser, 15000);

$(document).mousemove(function(){
    //clear the timeout and reset
    clearTimeout(inactiveTimeout);
    inactiveTimeout = setTimeout(handleInactiveUser, 15000);
});

function handleInactiveUser(){
    // change the classes
    // show the popup
}

更新:演示很好地说明了我认为的原理。

于 2012-09-27T13:27:45.113 回答