zoukankan      html  css  js  c++  java
  • visibility API

    这是一篇简短的小博文,介绍检测页面是否可见的API。

    参考 https://developer.mozilla.org/en-US/docs/Web/API/Page_Visibility_API

    document.hidden:如果页面可见返回true,否则返回false

    document.visibilityState:返回状态字符串,可见visible,不可见hidden。文档上还写了prerender和unloaded。

    visibilitychange事件在页面可见性变化时触发。切换标签、最小化窗口会触发,但是如果打开网页状态下开启其他应用不会触发。

    下面是兼容代码:

    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";
    }
    function handleVisibilityChange() {
    	console.log(document.visibilityState)
    	if (document[hidden]) {
    		hiddenFun() //这里是要执行的函数
    	}else {
    		visibleFun() //这里是要执行的函数
    	}
    }
    document.addEventListener(visibilityChange, handleVisibilityChange, false);
    

      

  • 相关阅读:
    Lesson 61-62 Are Relatives Important to You?
    Lesson 59-60 Househusband
    Lesson 57-58 Cosmetic Surgery
    Lesson 55-56 TV Commercials
    Blash
    高维宇宙
    巴卡尔
    完美标号
    小A点菜(luogu 1164)简单DP
    聪明的质监员(qc)
  • 原文地址:https://www.cnblogs.com/lymvv/p/8400660.html
Copyright © 2011-2022 走看看