最近做个弹幕,用的是第三方的插件,在浏览器页面切换到后台,返回后发现数据有堆叠卡死的情况,如何解决这个问题?网上参考了些demo,大致可以实现

1.document.hidden( Boolean值, 表示当前页面可见还是不可见)

2.document.visibilityState( 返回当前页面的可见状态。 分为 "hidden" 跟 "visible")

下面是代码部分:
document.addEventListener("visibilitychange", function () {

if (document.visibilityState == "visible") {
      document.title='页面可见';
     //do something
     //继续播放弹幕
}
if (document.visibilityState == "hidden") {

document.title='页面不可见';
   //do something else
   //暂停播放弹幕
   }
})

参考:Page Visibility API 教程

js监测页面是否切换到后台的更多相关文章

  1. js前台页面显示中文,后台存对应的value值实现

    field: 'rightType', title: '权益类型', //width: 100, align: 'left', valign: 'top', sortable: true, forma ...

  2. 原生JS—实现图片循环切换及监测鼠标滚动切换图片

    今天我们主要讲讲如何使用原生JS实现图片的循环切换的方法以及如何检测鼠标滚动循环切换图片.多余的话我们就不多说了,我们一个一个开始讲吧. 1  原生JS实现图片循环切换 -- 方法一 在上栗子之前我们 ...

  3. js判断当前浏览器页面是否切换

    公司做mifi设备,ui界面很多信息需要1S钟不断异步请求更新信息,如果同时打开多个浏览器或者多个当前界面,设备1S钟会收到很多个请求,由于设备本身内存限制,会导致响应速度过慢,且会造成设备重启等. ...

  4. JS刷新页面总和!多种JS刷新页面代码!

    1)<meta http-equiv="refresh"content="10;url=跳转的页面">10表示间隔10秒刷新一次2)<scri ...

  5. Vue.js+vue-element搭建属于自己的后台管理模板:什么是Vue.js?(一)

    Vue.js+vue-element搭建属于自己的后台管理模板:Vue.js是什么?(一) 前言 本教程主要讲解关于前端Vue.js框架相关技术知识,通过学习一步一步学会搭建属于自己的后台管理模板,并 ...

  6. Vue.js+vue-element搭建属于自己的后台管理模板:Vue.js快速入门(二)

    Vue.js+vue-element搭建属于自己的后台管理模板:Vue.js快速入门(二) 前言 上篇文章对Vue.js有了初步理解,接下来我们把Vue.js基础语法快速的过一遍,先混个脸熟留个印象就 ...

  7. vue环境搭建及单页面标签切换实例

    复习 """ 1.指令: v-once: <p v-once>{{ msg }}</p> v-cloak: 防止页面加载抖动 v-show:绑定的 ...

  8. 原生JS实现全屏切换以及导航栏滑动隐藏及显示——重构前

    思路分析: 向后滚动鼠标滚轮,页面向下全屏切换:向前滚动滚轮,页面向上全屏切换.切换过程为动画效果. 第一屏时,导航栏固定在页面顶部,切换到第二屏时,导航条向左滑动隐藏.切换回第一屏时,导航栏向右滑动 ...

  9. js实现图片自动切换效果。

    js实现图片自动切换效果,简单实用,原谅我只是一只小菜鸟还在学大神天天写博文装逼. <script language="javascript"> setInterval ...

随机推荐

  1. linux nf_conntrack 连接跟踪机制

    PRE_ROUTING和LOCAL_OUT点可以看作是整个netfilter的入口,而POST_ROUTING和LOCAL_IN可以看作是其出口; 报文到本地:PRE_ROUTING----LOCAL ...

  2. 378. Kth Smallest Element in a Sorted Matrix(大顶堆、小顶堆)

    Given a n x n matrix where each of the rows and columns are sorted in ascending order, find the kth ...

  3. [LeetCode题解]21. 合并两个有序链表 | 递归

    解题思路 使用递归实现: 定义函数功能:合并两个有序链表,并返回链表的头 结束条件:两个链表其中一个为空,返回另一个链表 递推公式: l1.val < l2.val:l1.next = Merg ...

  4. Java 中常见的细粒度锁实现

    上篇文章大致说了下 ReentrantLock 类的使用,对 ReentrantLock 类有了初步的认识之后让我们一起来看下基于 ReentrantLock 的几种细粒度锁实现. 这里我们还是接着用 ...

  5. 这次齐了!Java面向对象、类的定义、对象的使用,全部帮你搞定

    概述 Java语言是一种面向对象的程序设计语言,而面向对象思想是一种程序设计思想,我们在面向对象思想的指引下, 使用Java语言去设计.开发计算机程序. 这里的对象泛指现实中一切事物,每种事物都具备自 ...

  6. xios封装

    封装的意义 1.提高代码可读性2.提高代码可维护性3.减少代码书写 封装 import axios from 'axios' axios.defaults.baseURL = 'http://127. ...

  7. 利用python库stats进行t检验

    ​ t检验通常分为三种,分别是单样本t检验.双样本t检验和配对样本t检验.本文基于python的scipy.stats函数对每种t检验进行了介绍和实验. 一.t检验介绍 无论哪种t检验,都有以下的基本 ...

  8. 14_TTS

    TTS(Text to speech)为语音合成的意思.本课程主要介绍了TTS的使用方法. 1 package cn.eoe.tts; 2 3 import java.util.Locale; 4 i ...

  9. chrome浏览器查看当前页面cookie

    方法一:点进去设置--高级--网站设置--权限cookie--查找所有cookie和网站数据,就可以看到所有的cookie信息了,举例: 方法二:键盘F12,找到network--点击Doc(如果没有 ...

  10. Beta冲刺随笔——Day_One

    这个作业属于哪个课程 软件工程 (福州大学至诚学院 - 计算机工程系) 这个作业要求在哪里 Beta 冲刺 这个作业的目标 团队进行Beta冲刺 作业正文 正文 其他参考文献 无 今日事今日毕 林涛: ...