如何检测浏览器未最小化和相关选项卡未激活
How to detect browser not minimized and relevant tab is not inactive
在我的网站中,有一个下载页面。我想让我的用户在下载页面等待15秒。我想在下载按钮出现之前添加15秒计时器。同时,如果用户在浏览器中单击其他选项卡或最小化浏览器,计时器应停止。
我的问题是如何检测用户在网页上保持观看,这意味着浏览器没有最小化,这个选项卡不是不活动的。如何在javascript
中完成此任务
这里有一个现成的js
(function() {
var hidden, visibilityChange;
if (typeof document.hidden !== "undefined") {
hidden = "hidden";
visibilityChange = "visibilitychange";
} else if (typeof document.mozHidden !== "undefined") {
hidden = "mozHidden";
visibilityChange = "mozvisibilitychange";
} else if (typeof document.msHidden !== "undefined") {
hidden = "msHidden";
visibilityChange = "msvisibilitychange";
} else if (typeof document.webkitHidden !== "undefined") {
hidden = "webkitHidden";
visibilityChange = "webkitvisibilitychange";
}
// If the page is hidden, pause the countdown;
// if the page is shown, resume the countdown
function handleVisibilityChange() {
if (document[hidden]) {
//pause your countdown
} else {
//resume your countdown
}
}
// Warn if the browser doesn't support addEventListener or the Page Visibility API
if (typeof document.addEventListener === "undefined" ||
typeof document[hidden] === "undefined") {} else {
// Handle page visibility change
document.addEventListener(visibilityChange, handleVisibilityChange, false);
}
})();
希望这对你有帮助!:)
相关文章:
- 如何从外部页面激活非默认引导选项卡
- 选项卡侦听器未被来自后台脚本的消息激活
- 如何在ASP.NET中单击按钮后激活启动选项卡
- 从下拉列表中选择其他选项时激活文本框
- 激活镀铬窗口选项卡
- Javascript选项卡未正确激活
- 如何在刷新后激活菜单选项卡
- 通过自定义JS功能激活Sencha Touch选项卡
- 如何触发 HTML 选择单击事件(使用选项激活选择下拉列表)
- JavaScript 阻止 Twitter 引导选项卡链接激活
- 当选项卡未激活时,javascript 不起作用
- 使用页面上其他位置的链接激活选项卡
- 使用 Jquery 单击菜单链接时,激活或添加菜单选项卡上的类活动
- 如何检测选项卡的激活位置
- 激活选项卡面板中的选项卡而不访问它 extjs4.2.
- 在角度状态更改后激活特定选项卡
- 如何使用按钮从外部激活导航选项卡
- Jquery:选项卡式菜单导航,根据所选菜单激活和停用
- 如何在回发上保留选定的选项卡或以编程方式调用之前激活方法
- 如何使一个选项激活并禁用其他选项