JSFiddle - React, Tailwind, and code Playground

HTML

<h1>Mude de aba e volte aqui</h1>

CSS

body {
    margin:0;
    font-family:Arial, sans-serif;
}
p {
    padding:10px;
    background:#eee;
    margin:0 0 1px 0;
    background:#FF9090;
}
p.visible {
    background:#98FFB0;
}

JavaScript

var hidden, visibilityChange;
if (typeof document.hidden !== "undefined") {
    hidden = "hidden";
    visibilityChange = "visibilitychange";
} else if (typeof document.mozHidden !== "undefined") {
    hidden = "mozHidden";
    visibilityChange = "mozvisibilitychange";
} else if (typeof document.msHidden !== "undefined") {
    hidden = "msHidden";
    visibilityChange = "msvisibilitychange";
} else if (typeof document.webkitHidden !== "undefined") {
    hidden = "webkitHidden";
    visibilityChange = "webkitvisibilitychange";
}

document.addEventListener(visibilityChange, acao, false);

function acao() {
    console.log("a");
    var b = $('body');
    if (document.hidden) {
        b.append('<p>A janela está não está sendo vista.</p>');
    } else {
        b.append('<p class="visible">A janela está está visivel.</p>');
    }
}

acao();