页面可见性用途

2024年3月2日 212次阅读 来源: 少年版

页面可见性有哪些用途？

页面可见性：对于用户来说，可见性的意思就是能不能看到，显示的页面，就是我们正在看的页面，隐藏的页面，就是我们没有看的页面。因为我们一次要打开好多标签页面来回切换着，始终只有一个页面在我们眼前，其它页面都是隐藏的。
使用方式：给document添加visibilitychange事件，document.hidden为true则可见，为false则为隐藏，不同页面之间切换，促发visbilitychange事件.

document.addEventListener("visibilitychange",function(){
    if(document.hidden){
        document.title="hidden";
    }
    else{
        document.title="visibile"
    }
});
console.log(document.visibilityState);

备注：动画，视频，音频都可以在页面显示时打开，在页面隐藏时关闭

实现不使用 border 画出1px高的线，在不同浏览器的标准模式与怪异模式下都能保持一致的效果

<div style="height:1px; overflow:hidden;background:red"></div>
    原文作者：少年版
    原文地址: https://segmentfault.com/a/1190000018366221
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞