How to tell if browser/tab is active [duplicate]

Question

Possible Duplicate:
Is there a way to detect if a browser window is not currently active?

I have a function that is called every second that I only want to run if the current page is in the foreground, i.e. the user hasn't minimized the browser or switched to another tab. It serves no purpose if the user isn't looking at it and is potentially CPU-intensive, so I don't want to just waste cycles in the background.

Does anyone know how to tell this in JavaScript?

Note: I use jQuery, so if your answer uses that, that's fine :).

Answer 1

In addition to Richard Simões answer you can also use the Page Visibility API.

if (!document.hidden) {     // do what you need } 

This specification defines a means for site developers to programmatically determine the current visibility state of the page in order to develop power and CPU efficient web applications.

Learn more (2019 update)

• All modern browsers are supporting document.hidden
• http://davidwalsh.name/page-visibility
• https://developers.google.com/chrome/whitepapers/pagevisibility
• Example pausing a video when window/tab is hidden
  https://web.archive.org/web/20170609212707/http://www.samdutton.com/pageVisibility/

Answer 2

You would use the focus and blur events of the window:

var interval_id; $(window).focus(function() {     if (!interval_id)         interval_id = setInterval(hard_work, 1000); });  $(window).blur(function() {     clearInterval(interval_id);     interval_id = 0; }); 

---

To Answer the Commented Issue of "Double Fire" and stay within jQuery ease of use:

$(window).on("blur focus", function(e) {     var prevType = $(this).data("prevType");      if (prevType != e.type) {   //  reduce double fire issues         switch (e.type) {             case "blur":                 // do work                 break;             case "focus":                 // do work                 break;         }     }      $(this).data("prevType", e.type); }) 

Click to view Example Code Showing it working (JSFiddle)