No post com o 3D CountDown FIVe3D (ver também como eu fiz: escrever uma contagem regressiva para o Flash ), foi proposta a criação de um objeto de classe em Actionscript CountDown, aqui está uma versão similar em JavaScript:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 | / ** * Classe CountDown * * @ Autor Giovambattista Fazioli * E-mail @ @ g.fazioli undolog.com * @ Web http://www.undolog.com * * "Ano mês dia ', @ Param dd (string) * * / dd ) { contagem regressiva função (dd) { / / Init alvo tempo new Date ( dd ) ; var target = new Date (dd); = target. getTime ( ) ; . targetTime este = getTime alvo ().; / ** * Atualizar contagem regressiva * / = function ( ) { isso. refresh = function () { new Date ( ) ; var hoje = new Date (); today. getTime ( ) ; var hoje = currentTime getTime ().; / Time / esquerda ( this . targetTime - currentTime ) ; este _leftMilliseconds = (this. targetTime - currentTime).; Math. floor ( this ._leftMilliseconds / 1000 ) ; . _leftSeconds este = floor Math (_leftMilliseconds this. / 1000).; Math. floor ( this ._leftSeconds / 60 ) ; Neste piso _leftMinutes Math = (_leftSeconds this. / 60)..; Math. floor ( this ._leftMinutes / 60 ) ; . _leftHours este = floor Math (this. _leftMinutes / 60).; / / Sem módulo = Math. floor ( this ._leftHours / 24 ) ; . leftDays este = floor Math (_leftHours this. / 24).; / / Para imprimir = this ._leftMilliseconds % 1000 ; este leftMilliseconds = esta _leftMilliseconds% 1000..; = this ._leftSeconds % 60 ; este leftSeconds = esta _leftSeconds 60%..; = this ._leftMinutes % 60 ; este leftMinutes = esta _leftMinutes 60%..; = this ._leftHours % 24 ; .. essa leftHours = esta _leftHours 24%; } ( ) ; esse refresh ().; } |
Exemplo
1 2 3 | new countDown ( '1 1, 2009' ) ; var cd = new CountDown (1 '1, 2009 '); / / Mostra quantos dias, horas, minutos, segundos e milésimos de segundo para 01 de janeiro de 2009 |
Olá Giovambattista,
Acho esta solução muito atraente JavaScript, porque é simples e leve. Como um amante de scripting, eu fiz algumas alterações no seu código que você coloque o seguinte:
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
/ / Init alvo tempo
new Date ( dd ) ; var target = new Date (dd);
= target. getTime ( ) ; . targetTime este = getTime alvo ().;
/ **
* Atualizar contagem regressiva
* /
= function ( ) { isso. refresh = function () {
new Date ( ) ; var hoje = new Date ();
today. getTime ( ) ; var hoje = currentTime getTime ().;
/ Time / esquerda
= this . targetTime - currentTime ; . leftMilliseconds este = targetTime isso - currentTime.;
= Math. floor ( this . leftMilliseconds / 1000 ) ; . leftSeconds este = floor Math (leftMilliseconds this. / 1000).;
= Math. floor ( this . leftSeconds / 60 ) ; Neste piso leftMinutes Math = (leftSeconds this. / 60)..;
= Math. floor ( this . leftMinutes / 60 ) ; . leftHours este = floor Math (this. leftMinutes / 60).;
= Math. floor ( this . leftHours / 24 ) ; . leftDays este = floor Math (leftHours this. / 24).;
( ) ; essa render ().;
};
= function ( ) { esse render. = function () {
= this . ms = this . leftMilliseconds % 1000 ; este leftMilliseconds = esta ms = esta leftMilliseconds% 1000...;
= this . s = this . leftSeconds % 60 ; este leftSeconds = esta s = esta leftSeconds 60%...;
= this . m = this . leftMinutes % 60 ; este leftMinutes = m este = this leftMinutes 60%...;
= this . h = this . leftHours % 24 ; este leftHours = esta h = esta leftHours 24%...;
= this . leftDays ; esta d = este leftDays..;
};
= function ( _format ) { isso. output = function (_format) {
_format. split ( ' ' ) || 'dhms ms' , output = '' ; var format = _format split ('') | | 'dhms ms', output =''.;
/ / Alert (fn), comentado por undo = =: D
var t in format ) { for (var formato t) {
this [ format [ t ] ] ) output += this [ format [ t ] ] + ( ( t != format. length - 1 ) ? ', ' : '' ) ; if (este [formato [t]]) output + = this [formato [t]] + ((t! = comprimento do formato -.? 1)',':'');
}
output ) ; documento write (output).;
};
( ) ; esse refresh ().;
}
Em essência, acrescentando mais corpo é representado pelo método de saída, que permite que você imprima a contagem regressiva com o formato desejado pelo usuário (de uma forma muito semelhante ao que acontece em PHP).
Por exemplo, se você quiser imprimir o dia, hora, minutos, segundos e milésimos de falta através de nossa contagem regressiva, poderíamos proceder da seguinte maneira, cada vez, sem recorrer à chamada das propriedades internas de nossa classe:
2
'dhms ms' ) ; cd de saída ("dhms ms ').;
O método "render" também cuida do "normalizar" o formato de números.
Outra adição interessante poderia ser uma forma de "start", que invoca a saída periodicamente para se parecer com uma contagem regressiva real (contagem regressiva que pode ser interrompido pelo respectivo método "stop").
Richard Worth
@ Richard Worth: uma versão muito legal, bravo! Especialmente técnica interessante para o formato da saída: engenhoso e sutil! più che un
document.write()… ma è un dettaglio. No métodooutput()iria colocar um limite para oreturn(output)mais de umdocument.write()... mas é um detalhe. , renderebbe il tutto davvero completo. Um cronômetro comstart()estop(), fazer tudo muito completo. Parabéns e obrigado pela sugestões interessantes@ Giovambattista Fazioli:
è d'obbligo Claro, eu coloquei o
document.write()para notificação imediata dos testes, a versão de produção final de umreturné obrigatóriaVocê é bem-vindo, fiquei contente que a troca de assessoria técnica
Até breve,
Richard Worth
Update: Microsoft Internet Explorer 7, a data em formato numérico, tipo
"3 5, 2008", produz erro. Para excluir basta digitar o "mês" no formato 3 letras Inglês: Jan, Feb, Mar, etc ...@ Giovambattista Fazioli:
Olá a todos.
Eu encontrei este script muito interessante.
O meu único problema? Ser um idiota eu acho difícil de inserir JavaScript em uma página web.
A mudança para o código que eu iria fazer era "retorno" ao invés de document.write mas não me lembro depois id a página não entender o que eu uso.
Você pode me ajudar?
obrigado
Olá