Page Visibility API Tutorial with Example

//document.hidden retuns true if page is not visible.
            if("hidden" in document)
            {
                console.log("Hidden status: " + document.hidden);
            }
            else if("mozHidden" in document)
            {
                console.log("Hidden status: " + document.mozHidden);   
            }
            else if("msHidden" in document)
            {
                console.log("Hidden status: " + document.msHidden);
            }
            else if("webkitHidden" in document)
            {
                console.log("Hidden status: " + document.webkitHidden);
            }
            else
            {
                console.log("Your browser doesn't support page visibility API");
            }

            //document.visibilityState retuns visible, hidden, prerender or unloaded.
            //prerender means document content is being prerenderd and is not visible to the users.
            //unloaded means page is being unloaded from memory.
            if("visibilityState" in document)
            {
                console.log("Visibility State is : " + document.visibilityState);
            }
            else if("mozVisibilityState" in document)
            {
                console.log("Visibility State is : " + document.mozVisibilityState);
            }
            else if("msVisibilityState" in document)
            {
                console.log("Visibility State is : " + document.msVisibilityState);
            }
            else if("webkitVisibilityState" in document)
            {
                console.log("Visibility State is : " + document.webkitVisibilityState);
            }
            else
            {
                console.log("Your browser doesn't support page visibility API");
            }


            //this event is fired when value of document.hidden or document.visibilityState changes.
            document.addEventListener("visibilitychange", function() {}, false);
            document.addEventListener("mozvisibilitychange", function() {}, false);
            document.addEventListener("msvisibilitychange", function() {}, false);
            document.addEventListener("webkitvisibilitychange", function() {}, false);