当用户切换选项卡时暂停html5视频
当用户切换选项卡时暂停html5视频
提问于 2015-01-19 20:58:17
我有一个HTML5视频嵌入我的网页：
<video id="myvideo">
<source src="videos/myvideo.mp4">
</video>当用户转到不同的浏览器窗口或选项卡时，我有一些jQuery来暂停视频。还可以在用户返回时播放视频：
// pause when the user leaves this window/tab
$(window).blur(function(){
$('#myvideo').get(0).pause();
});
// play when the user returns to this window/tab
$(window).focus(function(){
$('#myvideo').get(0).play();
});这样做的问题是，如果用户单击地址栏或聚焦于不同的OS窗口，也会暂停视频，即使视频是可见的，并且用户没有切换选项卡。
是否有一种方法可以根据当前选项卡是否打开(但不一定是焦点)来暂停/播放视频？
回答 1
Stack Overflow用户
回答已采纳
发布于 2015-01-19 21:01:58
我几乎是在发完这个问题后立即找到答案的。页面可见性API允许您知道什么时候网页是可见的或焦点。有一个很好的jQuery空间叫做jquery-可视性，它为跨浏览器解决方案提供了一个干净的API。使用它，您可以做如下事情：
$(document).on('show.visibility', function() {
$('#myvideo').get(0).play();
});
$(document).on('hide.visibility', function() {
$('#myvideo').get(0).pause();
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/28033359
复制相关文章
相似问题
腾讯云开发者
