如何在PHP中打開的選項卡上的活動頁面中檢查此頁面

Question

在instagram中，當您打開並查看某人的故事時，它會一直超時直到下一個故事，但是當您更改瀏覽器選項卡時，它會停止，而當您返回時，它會從離開頁面的位置開始。 對不起，我的英語不好，我希望你明白了。

所以我該如何在php中做到這一點，我想在用戶離開標簽頁時停止倒計時。

Answer 1

您可以使用以下功能獲取用戶離開的時間

$(window).blur(function(e) {
    // What to do when user leaves
});

然后當用戶返回時獲得另一個

$(window).focus(function(e) {
    // What to do when user comes back
});

使用它的ready ，因為它會自動觸發focus功能，如果DOM尚未加載它可以引發錯誤。 還要記住，要做好准備，使其在第一時間不做任何事情，除非這不是問題。

Answer 2

這是一個示例，如何在更改瀏覽器選項卡時使動畫保持同步 。

當當前瀏覽器選項卡處於啟用狀態或處於活動狀態時，您可以使用相同的方法使用HTML 5可見性API來暫停/恢復故事超時，如下所示：

var vis = (function(){
var stateKey, 
    eventKey, 
    keys = {
            hidden: "visibilitychange",
            webkitHidden: "webkitvisibilitychange",
            mozHidden: "mozvisibilitychange",
            msHidden: "msvisibilitychange"
};
for (stateKey in keys) {
    if (stateKey in document) {
        eventKey = keys[stateKey];
        break;
    }
}
return function(c) {
    if (c) document.addEventListener(eventKey, c);
    return !document[stateKey];
}})();

在Codepen上進行實時預覽： https ：//codepen.io/jonathan/pen/sxgJl