HTML5 Page Visibility API 在切换到其他窗口时不起作用
By ivanilla
at 2016-10-19
0人收藏 • 6266人看过
切换到浏览器其他tab以及最小化浏览器窗口可以触发VisibilityChange事件,但新建浏览器窗口或者切换到其他应用程序(此时整个浏览器窗口都处于非活动状态)却无法触发这个事件,有办法解决吗?
另外有没有比较好的办法在WebApp防止屏幕睡眠(在手机是锁屏)?Standby API似乎太新了,旧一些的浏览器可能不支持。。。
这个项目 https://github.com/richtr/NoSleep.js 倒是可以试试,但issues里面一堆XX设备测试失败的。。。
- 登录后方可回帖
回复#2 @lincanbin :
canvas玩游戏用的
回复#2 @lincanbin :
如果循环播放视频可以阻止设备屏幕睡眠,那hidden这个视频应该也可以。
回复#4 @ivanilla :
大概可以,毕竟iOS上也有后台不断播放无声音乐来防止自己的后台被杀掉的方法。
回复#5 @lincanbin :
浏览器不知行不行,到时试试看
回复#6 @ivanilla :
video标签应该有这个阻止睡眠的功能。
回复#7 @lincanbin :
我测试了下,桌面最新版FF和Chrome目前还不支持Standby API,这个是W3C 2014年提出的草案,到现在还没浏览器真正支持?或者我用错方法了?我的判断方法是:
if (typeof navigator.wakeLock !== "undefined")
不知有没有问题,反正这边判断的都是false。
不过可以肯定2014年之前的浏览器版本一定不支持。
回复#8 @ivanilla :
我测了下还真没支持的,大概还没正式定稿吧。
回复#9 @lincanbin :
试试这段?
navigator.wakeLock.request("display").then( function successFunction() { // somecode }, function errorFunction() { // somecode });
可以alert测试,只要控制台没错误信息应该就可以了。
回复#9 @lincanbin :
另外移动平台你测试了吗?
回复#10 @ivanilla :
不行
回复#11 @ivanilla :
移动端你可以用vConsole调试。
回复#12 @lincanbin :
显示undefined?
回复#13 @lincanbin :
我试了下,Android浏览器(我测试了最新版FF和Chrome)的锁屏对于PV API是有反应的,不管是手动按电源键锁屏还是屏幕自动睡眠,但iOS7(我懒得升级。。。)的Safari和Chrome则没反应。
不过移动版Chrome在锁屏会触发两次事件。。。
回复#15 @ivanilla :
Chrome真神秘。
回复#16 @lincanbin :
移动版Chrome在关闭标签时还会触发一次hidden事件。
回复#16 @lincanbin :
有没有强制网页横屏显示的比较好的解决方案?
Screen Orientation API太新了:https://www.w3.org/TR/screen-orientation/#examples
manifest.json的形式似乎只适合于类似浏览器扩展那样用的WebApp:
{ "display": "fullscreen", "orientation": "landscape", }
但我要在普通HTML5网页中使用。。。
最原始的解决方法是CSS3的@media方式:
@media screen and (orientation:portrait) { // CSS applied when the device is in portrait mode } @media screen and (orientation:landscape) { // CSS applied when the device is in landscape mode}
(当然也有把and换成only的)
我还是打算做成failback的形式。
回复#18 @ivanilla :
直接整页旋转90°就是个不错的方案了。