Displaying pages and events on a page does not work as expected on ios chrome

Apple documentation lists the available iOS browser events here: https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariWebContent/HandlingEvents/HandlingEvents.html

The events of "pagehide" and "pageshow" seem to work fine in safari, but in chrome it only works when loading and unloading a page. This does not work on:

  1. Pressing the Home button, that is, sending Chrome to the background

  2. Tab Switching

Below is a small piece of Javascript code that you can use to test it:

<script type="text/javascript"> window.addEventListener("pageshow", function(evt){ alert('show'); }, false); window.addEventListener("pagehide", function(evt){ alert('hide'); }, false); </script> 

What can I do to determine if Chrome has been sent to the background or not. I need to clear the setTimeout timer as soon as Chrome comes to the fore. Are there any workarounds?

+8
javascript google-chrome javascript-events ios dom-events
source share
2 answers

Below is the working code:

 <script type="text/javascript"> var heartbeat; var lastInterval; function clearTimers() { clearTimeout(heartbeat); } function getTime() { return (new Date()).getTime(); } function intervalHeartbeat() { var now = getTime(); var diff = now - lastInterval - 200; lastInterval = now; if(diff > 1000) { // don't trigger on small stutters less than 1000ms clearTimers(); } } lastInterval = getTime(); heartbeat = setInterval(intervalHeartbeat, 200); 

Here you can find more information: http://aawaara.com/post/74543339755/smallest-piece-of-code-thats-going-to-change-the-world

+6
source share

Pagehide and pageshow are not the events you need for what you are trying to accomplish.

Instead, use the visibilitychange event in combination with document.hidden or document.visibilitystate , which should do exactly what you want.

This will only work on supported browsers - currently includes Chrome, but not Safari (for now). Therefore, to be safe, I would call clearTimers() on visibilitychange and return to calling it on the pagehide only if document.visibilitystate is not defined.

Cm:

MDN: visibilitychange event

MDN: using the page visibility API

Page Visibility - W3C Recommendation October 2013

+2
source share

All Articles