Só mostrar div se o usuario esperar 3 segundos fora da página

[suelystonn 3]

Olá pessoal,

 

Na minha página tem isso aqui:

<table width="auto" border="0" cellpadding="0" cellspacing="0" class="fonte3">
<tr>
<td class="janelaHeader" id="s_proximo" style="display:none;">
<input type="button" value="Próximo" class="btn btn-info" title="Próximo"/>
</td>
</tr>
</table

<table width="auto" border="0" cellpadding="0" cellspacing="0" class="fonte3">
              <tr>
                <td height="30" id="h_msg">
				<div>
				<img src="images/carregando.gif" width="5%" style="padding-left:150px" />Aguardando você clicar em Atividades2
				</div>
				</td>
                <td height="30" id="cronometro" style="padding-left:150px">
				</td>
              </tr>
            </table>

<table width="auto" border="0" cellpadding="0" cellspacing="0" class="fonte33" style="border-bottom: 1px solid orange;">

<tr>

<td height="30"><a href="atividades2.php" target="_blank" id="ghjk">Atividades2</a></td>

</tr>

</table>

E no meu JavaScript:

<script type="text/javascript">
function contagemRegressiva()
{

    i--;
    document.getElementById('cronometro').innerHTML = '<img src="images/carregando.gif" width="5%" />Você já clicou, agora aguarde 15 segundos';
    if (i == 0 ){
        document.getElementById('cronometro').style.display='none';
        exibirDiv();
    }
}

function exibirDiv() {
		document.getElementById('s_proximo').style.display='';
}

function esconderDiv() {
		document.getElementById('h_msg').style.display='none';
}


var i = 15;
$(function(){
    document.getElementById('ghjk').onclick=function(event){
		setTimeout("esconderDiv()", i * 0);
        setInterval("contagemRegressiva()", 1000);
	}});

</script>

Oque isso tudo ai faz é que quando a página é carregada, terá um link com o nome 'Atividades2' e também terá na tela uma mensagem='Aguardando você clicar em Atividades2'

 

ao clicar no link essa mensagem some e será mostrada essa outra='Você já clicou, agora aguarde 15 segundos'.

 

e depois desses 15 segundos será exibido o botão='Próximo'

 

Pois bem, oque eu quero é que depois que acabar os 15 segundos seja executada outra função que conte até 3 segundos só que ai tem outra coisa, eu só quero que seja contado os 3 segundos se o usuario estivar em outra aba, ou janela, menos nessa página. Se quando acabar os 15 segundos e ele ainda estiver na página não será contado os 3 e portanto o botão 'Próximo' não pode ser exibido.

 

Entenderam? Muito complicado né? Mas isso foi a melhor solução que encontrei para o meu problema.

[William Bruno 1501]

Cara, vc pode tentar utilizando a api page visibility

 

https://developer.mozilla.org/en-US/docs/Web/Guide/User_experience/Using_the_Page_Visibility_API

[suelystonn 3]

Desculpa pela demora pra responder. Obrigado William Bruno, estudei esta api e consegui oque queria. :clap: :joia: