getElementById visibility="none"

[btcv]

bom dia a todos,

recentemente estou a desenvolver o relógio com countback, a ideia era quando o relógio está a 0 mostra uma mensagem "Fim!". Até ai esta tudo bem esta a funcionar muito bem, mas queria que quando o relógio estiver a 0, uma div com o id="clica" ficasse escondida. andei a pesquisar na net e seria esta instrução

document.getElementById("clica").style.visibility="none";

penso que não estou errado.

no meu JS tenho o seguinte código:

function calcage(secs, num1, num2) {
s = ((Math.floor(secs/num1))%num2).toString();
if (LeadingZero && s.length < 2)
s = "0" + s;
return "<b>" + s + "</b>";
}

function CountBack(secs) {
if (secs < 0) {

document.getElementById("cntdwn").innerHTML = FinishMessage;

return;

document.getElementById("clica").style.visibility="none"; return;
}
DisplayStr = DisplayFormat.replace(/%%D%%/g, calcage(secs,86400,100000));
DisplayStr = DisplayStr.replace(/%%H%%/g, calcage(secs,3600,24));
DisplayStr = DisplayStr.replace(/%%M%%/g, calcage(secs,60,60));
DisplayStr = DisplayStr.replace(/%%S%%/g, calcage(secs,1,60));

document.getElementById("cntdwn").innerHTML = DisplayStr;
if (CountActive)
setTimeout("CountBack(" + (secs+CountStepper) + ")", SetTimeOutPeriod);
return;


}

function putspan(backcolor, forecolor) {
document.write("<span id='cntdwn' style='background-color:" + backcolor +
"; color:" + forecolor + "'></span>");
}

if (typeof(BackColor)=="undefined")
BackColor = "white";
if (typeof(ForeColor)=="undefined")
ForeColor= "black";
if (typeof(TargetDate)=="undefined")
TargetDate = "12/31/2020 5:00 AM";
if (typeof(DisplayFormat)=="undefined")
DisplayFormat = "%%D%% Days, %%H%% Hours, %%M%% Minutes, %%S%% Seconds.";
if (typeof(CountActive)=="undefined")
CountActive = true;
if (typeof(FinishMessage)=="undefined")
FinishMessage = "";
if (typeof(CountStepper)!="number")
CountStepper = -1;
if (typeof(LeadingZero)=="undefined")
LeadingZero = true;


CountStepper = Math.ceil(CountStepper);
if (CountStepper == 0)
CountActive = false;
var SetTimeOutPeriod = (Math.abs(CountStepper)-1)*1000 + 990;
putspan(BackColor, ForeColor);
var dthen = new Date(TargetDate);
var dnow = new Date();
if(CountStepper>0)
ddiff = new Date(dnow-dthen);
else
ddiff = new Date(dthen-dnow);
gsecs = Math.floor(ddiff.valueOf()/1000);
CountBack(gsecs);

​mas Quando o relógio está a 0 mostra a mensagem fim mas a div id="clica" está sempre visível.

alguem me pode dar uma dica?

obrigado pela atenção de todos.

Edited June 18, 2012 at 09:44 AM by brunoais
geshi!!!

[mjamado]

O atributo visibility não aceita o valor none. Existem display: none e visibility: hidden (que fazem coisas ligeiramente diferentes, cuidado).

[btcv]

mas mesmo com o visibility: hidden não da...

[brunoais]

mas mesmo com o visibility: hidden não da...

Como é que usaste para o visobility?

Já agora, eu não consigo ajudar-te com o código com essa indentação.

[btcv]

Viva brunoais,

estou a por assim :

document.getElementById("clica").style.visibility="hidden";

quando te referes a "código com essa indentação" o que te estas a referir?

[brunoais]

Viva brunoais,

estou a por assim :

document.getElementById("clica").style.visibility="hidden";

O que é que queres e o que é que ele está a fazer?

quando te referes a "código com essa indentação" o que te estas a referir?

Vê o código que tens no teu 1º post e vê a indentação.

[btcv]

o que eu queria, era quando o relógio ficasse a 00.00.00 activa a mensagem "fim" e isso esta a dar bem mas ao mesmo tempo uma div com id="clica" que é um botão, ficasse invisível..

o sistema é tipo um leilão, onde os users tem um determinado tempo para licitar de 0.50 de cada vez e de cada vez que o tempo fosse ao fim não queria dar a possibilidade de licitar mais.

optei por fazer um window.location = "xxx.php?p=11" para encerrar o leilão e finalizar as licitações.

estou a utilizar o função

setInterval(function() { $("#bt_clica").load("bt_clica.php?id=1'"); },3000);

para devolver os dados users e os dados do leilao em "tempo real" mas estive a testar com 8 janelas abertas e a carga do cpu no servidor vai aos 85%, o que torna as coisas muito lentas.

Sabes dizer-me se há outra forma de o fazer, para aliviar a carga do cpu?

obrigado pela atenção

Edited June 19, 2012 at 02:41 PM by brunoais
geshi!

[brunoais]

Usa AJAX mas não dessa maneira... Hum... Eu usava o API do browser... Experimenta usar o método ajax.

Se queres uma dica simples para acelerar a tua página eu dou-te. Não uses qualquer biblioteca, usa o API do browser.

Se confundes algumas partes que o IE só faz asneira, então aí já faz sentido usar uma biblioteca para essa parte específica (como a parte dos eventos que o IE8 ou anterior só atrapalha).

getElementById() é um método lento. Executa só quando é necessário e não cada vez que queres aceder ao node.

usa o API do browser para a ligação AJAX. Podes usar o JSON.parse para passar de JSON para um objeto em js. Podes tb usar XML, se queres que o sistema seja compatível com o IE8. Alternativamente, podes usar o JSON parser do jQuery.

Transfere pela rede exclusivamente dados! Esquece o HTML por AJAX(!), só dados! Neste caso, só precisas de enviar um numero que é o tempo que falta. Podes limitar-te a enviar pela rede um numero. É a maneira que acabas por só transferir 1 pacote entre o browser e o servidor.

Queres tornar o botão "incarregável"? Nada mais fácil, usa o element.removeEventListener ou o equivalente do jQuery. Não esquecendo de alterar a classe para algo que mostre que já n está disponível (CSS anyone(?)).

É um processo muito simples.

[btcv]

Mais uma vez obrigado Brunoais, a dica foi excelente, vou estudar a api... neste caso tenho de sacar 3 pacotes, o tempo, ultimas 4 licitações e por fim o valor em questão.. mas vou testar isso... obrigado mais uma vez.

[btcv]

dei com um bug no meu script, está a ir apanhar a hora do pc, e eu queria ir apanhar a hora do server, penso que é esta parte:

CountStepper = Math.ceil(CountStepper);
if (CountStepper == 0)
 CountActive = false;
var SetTimeOutPeriod = (Math.abs(CountStepper)-1)*1000 + 990;
putspan(BackColor, ForeColor);
var dthen = new Date(TargetDate);
var dnow = new Date();
if(CountStepper>0)
 ddiff = new Date(dnow-dthen);
else
 ddiff = new Date(dthen-dnow);
gsecs = Math.floor(ddiff.valueOf()/1000);
CountBack(gsecs);

mas como altero para ser a do server?

[brunoais]

Para obteres a hora do servidor tens que perguntar ao servidor que horas são.

Isso implica um request usando um XMLHttpRequest.

Podes receber essa hora a partir do servidor qd fazes o request para obter os dados mais recentes. A contagem decrescente é um processo fácil de controlo de números.

Tenta arranjar nomes melhores para as variáveis. Eu tenho dificuldade em perceber corretamente o teu código. Tens, por exemplo, a função putspan que não consigo perceber corretamente para que é que serve.

[btcv]

putspan é onde vai imprimir o relógio.

var dnow = new Date(); vem com esta configuração Fri Jun 22 2012 14:13:09 GMT+0100

experimentei fazer o seguinte:

$(function(){	

 $.ajax({
url: 'data.php',
success: function(data) {
 console.log(data);
 $('#datetime').html(data);

var dnow = data;

}
 });

});

onde no data.php tenho:

<?php
echo("".gmdate("D M j Y G:i:s", time())." GMT+0100");;
?>

mas queria que a var dnow fosse o valor do php, mas nao estou a conseguir.

[brunoais]

podes começar por usar o geshi

javascript aqui

php aqui

Depois disso, usa uma indentação que se perceba. Eu perco-me com essa indentação.