compte a rebours

**amarcil** · 24/01/2007, 14h49

bonjour a tous,

je viens de réaliser un compteur qui permet d'indiquer le temps restant depuis des valeurs passées en parametres: je passe l'heure, les minutes et les secondes en php et je veux afficher le décompte.

seul probleme, apres mains essais, je n'y parviens toujours pas!

Voici le code complet de ma page^^

merci de m'aider

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
 
<head>
<?
$val_heure=5;
$val_min=2;
$val_sec=3;
?>
 
<SCRIPT LANGUAGE="JavaScript">
	//Durée passée en paramètre
	var heures=<? echo $val_heure;?>;
	var minutes=<? echo $val_min;?>;
	var secondes=<? echo $val_secondes;?>;
 
function Rebour()
	{
		alert('ok');
		if (document.getElementById)
		{
			//1er: 
			if(secondes>0)
			{
				secondes--;
				document.getElementById("cpt_sec").innerHTML=secondes;
			}else
			{
				if(minutes>0)
				{
					minutes--;
					secondes=60;
					document.getElementById("cpt_sec").innerHTML=secondes;
					document.getElementById("cpt_min").innerHTML=minutes;
				}else if(minutes==0)
				{
					if(heures>0)
					{
						heures--;
						minutes=60;
						secondes=60;
						document.getElementById("cpt_sec").innerHTML=secondes;
						document.getElementById("cpt_min").innerHTML=minutes;
						document.getElementById("cpt_heure").innerHTML=heures;
					}
				}else
				{
					document.write('terminé');
				}
			}
		}
	}
temporebour = setTimeout("Rebour()", 1000); //rappel de la fonction apres 1000 ms soit 1 seconde
</script>
 
</head>
<body onload="Rebour()">
 
<p><font face="verdana" size="1">Powered by Xlight</font></a></p>
 
 
<script type="text/javascript">
document.write("<div id=\"cpt_heure\">hhh</div> heures avant ce que vous voulez");
document.write("<div id=\"cpt_min\">mmm</div> minutes avant ce que vous voulez");
document.write("<div id=\"cpt_sec\">sss</div> secondes avant ce que vous voulez");
</script>
</body>
</html>

**amarcil** · 24/01/2007, 15h53

il vous manque des precisons pour m'aider?

**Macintoc** · 24/01/2007, 17h59

Non, t'es tombé sur une heure creuse...

A vu de pif, comme ça, a chaud, je dirais qu'un truc de ce genre devrait fonctionner a peu prèt :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
 
function CountDown(deadEnd, fct){
    var deadEnd=deadEnd
 
    this.update=function(){
        var now=new Date()
        this.year=now.getFullYear()-deadEnd.getFullYear()
        this.month=now.getMonth()-deadEnd.getMonth()
        this.day=now.getDate()-deadEnd.getDate()
        this.hour=now.getHours()-deadEnd.getHours()
        this.minute=now.getMinutes()-deadEnd.getMinutes()
        this.second=now.getSeconds()-deadEnd.getSeconds()
        if(!(this.year+this.month+this.day+this.hour+this.minute+this.second)){
            clearInterval(timer)
            fct()
        }
    }
    var timer=setInterval(this.update, 1000)
}
 
function exec(){
    alert('Terminé')
}
 
var timer=new CountDown(new Date(2007, 0, 24, 17, 55, 20), exec)

Après, tu peux rajouter des propriétés/méthode dans le prototype de la class CountDown pour récupérer le nombre d'année/.../secondes qu'il reste ou modifier la date limite a travers l'objet timer. Mais ça dépasse un peu le cadre du topic.

**amarcil** · 24/01/2007, 18h45

oui mais en fait moi je ne veux pas manipuler les jours, je n'ai que des temps de quelques heures a gérer...

Du fait ça complexifie pas mal le code et j'ai un peu de mal

je veux afficher en live le décompte en plus . Par exemple, le décompte de 1h25min et 30 sec...

1h25 29sec .... et ainsi de suite jusque 0

**Macintoc** · 24/01/2007, 19h29

Envoyé par xlight

oui mais en fait moi je ne veux pas manipuler les jours, je n'ai que des temps de quelques heures a gérer...

Du fait ça complexifie pas mal le code et j'ai un peu de mal

Ca ne change rien. Faut juste préciser l'année, le mois et le jour au moment d'instancier la classe.
Par contre, tu peux diminuer la fréquence de mis à jour interne a la class CountDown à 100ms.

je veux afficher en live le décompte en plus . Par exemple, le décompte de 1h25min et 30 sec...

1h25 29sec .... et ainsi de suite jusque 0

Comme je l'ai dis, il suffit de créer des méthodes idoines, pour cela.
Grosso modo, un truc qui ressemblerai à :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
CountDown.prototype.getSecond=function(){
    return this.update.second
}

compte a rebours

JavaScript

Discussions similaires

Partager

Partager