6

Um amigo me passou um script de uma caixinha que abre quando alguém entra no site, porém, ao atualizar a página ela aparece novamente. Vocês poderiam me ajudar?

Abaixo o código:

function timer() {
    jQuery('.cloudbanner').hover(function () {
        jQuery('#follow').css('display', 'block');
        cronometro();
    });
    jQuery('.closeads').hover(function () {
        jQuery('#follow').css('display', 'block');
        cronometro();
    });
}

function cronometro() {
    setTimeout('amostra()', 3000);
}

function amostra() {
    jQuery('.cloudbanner').css('display', 'none');
    jQuery('#follow').css('display', 'none');
    jQuery('#fr').removeAttr('src');
}

function excludeDiv() {
    jQuery('#close').css('display', 'none');
    jQuery('.closeads').css('display', 'block');
    timer();
}

var numero = 5;
function chamar() {
    if (numero > 0) {
        document.getElementById('timers').innerHTML = --numero;
    }
}

setInterval("chamar();", 900);
setTimeout("excludeDiv();", 10000);

Imagino que isso tenha haver com cookie e eu deveria criar um, mas não sei como fazer.

4
  • Queres que ele corra uma vez somente e não quendo faz refresh à página? é isso?
    – Sergio
    Commented 15/05/2015 às 17:00
  • Está usando PHP? Commented 15/05/2015 às 17:06
  • Estou usando ela no Wordpress, no cabeçalho (index.php). O que eu queria é que ela aparecesse somente uma vez por dia. Commented 15/05/2015 às 19:17
  • Sugiro o fácil e rápido sessionStorage. Guarda variáveis durante a execução do Browser. Quando fechar o Browser as variáveis são limpas.
    – Guill
    Commented 22/05/2015 às 15:07

2 Respostas 2

3

Usando apenas javascript:

function setCookie(cname, cvalue, exdays) {
    var d = new Date();
    d.setTime( d.getTime() + (exdays * 24 * 60 * 60 * 1000) );

    var expires = 'expires=' + d.toUTCString();
    document.cookie = cname + '=' + cvalue + '; ' + expires;
}

function getCookie(cname) {
    var name = cname + '=';
    var ca = document.cookie.split(';');

    for( var i = 0; i < ca.length; i++ ) {
        var c = ca[i];
        while (c.charAt(0)==' ') c = c.substring(1);
        if (c.indexOf(name) == 0) return c.substring(name.length, c.length);
    }

    return '';
}

No seu cenário, o uso seria basicamente assim:

// Pega o valor do cookie "flag", se existir
var flag_alert = getCookie("flag");

// Se o cookie não existe -> o usuário nunca viu o alerta
if ( flag_alert != '' ) {
    document.getElementById('alert-id').style.display = 'block';

    // Seta um cookie com duração de 30 dias
    setCookie("flag", true, 30);
} else {
    document.getElementById('alert-id').style.display = 'none';
}

Usando um plugin chamado jQuery Cookie:

// Cria um cookie com duração de 30 dias
$.cookie(
    "alert_flag",
    true,
    {
        expires: 30 
    }
);

// Pegar valor do cookie
$.cookie("alert_flag");

// Deletar um cookie
$.cookie("alert_flag", null);

A Mozilla também criou um framework simples para escrita/leitura de cookies em javascript.

Porém se você quer manter a assertividade desse aviso ser mostrado apenas uma vez ao usuário é melhor salvar essa flag no banco, então no momento do login você guarda ela na sessão e faz as verificações, se quiser essa abordagem me avise que eu monto um código pra você.

1

Fiz um código que você pode colocar no início da página.

<?php
  session_start();
  if(!isset($_SESSION["caixinha"])){
    //pega a hora que a página foi carregada
    $_SESSION["hora"] = date('H');

    //se não existir é porque a caixinha não foi mostrada.
    echo"<script>funçãoQueMostraCaixa();</script>";
    $_SESSION["caixinha"] == 1;
  }else if($_SESSION["hora"] != date('H')){
    //se passar uma hora ele chama a função para mostrar a caixinha de novo
    echo"<script>funçãoQueMostraCaixa();</script>";
    //atualiza a hora
    $_SESSION["hora"] = date('H');
  }
?>

Ele cria uma session, e pega a hora em que a página é atualizada. Em outras palavas ele vai mostrar a caixinha que você só uma vez por hora. (Mas você pode mudar isso para um dia mudando a variável date('H')

2
  • Analisando meu código, eu deveria colocar o que no lugar do "caixinha" e do "funçãoQueMostraCaixa"? Commented 16/05/2015 às 4:10
  • "Caixinha" é só o nome da session, pode deixar do jeito que está. / "funçãoQueMostraCaixa" seria o nome da função que você definiu, é a função que faz a sua caixa aparecer. Commented 16/05/2015 às 4:34

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .