CODEWITHSUNDEEP
htmlpage-refresh
Anefi3
Anefi3

Reputation: 51

Refresh page when active tab

Currently in my page I am using this to refresh the page each minute:

<head>
...
<meta http-equiv="refresh" content="60" />
...
</head>

How instead, I want to refresh the page when a user presses the tab. Lets say a user has multiple tabs open in the web browser. And he uses a few minutes surfing on another tab. When he then press the tab for my website, I want the page to autorefresh, so the user don't have to do it himself to check for any updates on the page. How can I accomplish this?

Upvotes: 5

Views: 5446

Answers (1)

Andrea Viviani
Andrea Viviani

Reputation: 267

you should use js and visibility API:

include this small script in your html page:

<script>
document.addEventListener("visibilitychange", function() {
   if (document.hidden){
       console.log("Browser tab is hidden")
   } else {
       console.log("Browser tab is visible")
       location.reload();
   }
});
</script>

Adapted from here: Event for when user switches browser tabs

Upvotes: 10

Related Questions