Page visibility 页面可见性

2024-08-24 19:55:36

一直以来，判断页面是不是当前可见标签，浏览器有没有缩小都是比较麻烦的。

通过页面可见性API可以获得相关信息
document.hidden 判断页面当前是不是可见的
document.visibilitystate 过得页面状态，背后的标签或者前面的标签，预览图状态(类似window的小预览图)等四种状态
visibilitychange事件，当页面状态改变时触发

if (document.hidden || document.msHidden || document.webKitHidden){
//page is hidden
} else {
//page is not hidden
}

function handleVisibilityChange(){
var output = document.getElementById(“output”),
msg;
if (document.hidden || document.msHidden || document.webkitHidden){
msg = “Page is now hidden.” + (new Date()) + “<br>”;
} else {
msg = “Page is now visible.” + (new Date()) + “<br>”;
}
output.innerHTML += msg;
}
//need to add to both
EventUtil.addHandler(document, “msvisibilitychange”, handleVisibilityChange);
EventUtil.addHandler(document, “webkitvisibilitychange”, handleVisibilityChange);

最新文章

热门文章