Compte à rebours en JavaScript et PHP

Information

Ce compte a rebour fonctionne sur tout type de navigateur !! Vous voulez dans les dernières 24 heures informer vos visiteurs du temps qu'ils leur reste ? Ce compte a rebour est fait pour vous !!

Que vos données viennent d'une base SQL ou d'un formulaire, j'ai rendu le code portable et
vous devriez vite vous y faire !! 5..4..3..2..1.. et c'est partie !!

A oui !! la démo la voici la voila, j'ai mis exactement le meme script que le code ci dessous.

Démo en ligne

01
02
03
04
05
06
07
08
09
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
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91

                               
                            <?php
/*---------------------------------------------------------------*/
/*
    Titre : Compte &agrave; rebours en JavaScript et PHP                                                                  
                                                                                                                          
    URL   : https://phpsources.net/code_s.php?id=493
    Auteur           : KOogar                                                                                             
    Date édition     : 01 Fév 2009                                                                                        
    Date mise à jour : 19 Aout 2019                                                                                      
    Rapport de la maj:                                                                                                    
    - fonctionnement du code vérifié                                                                                    
*/
/*---------------------------------------------------------------*/
/*******************************************************************************
    * Url DEMO avec les memes parametres ci dessous
    ***************************************************************************/

/*       https://phpsources.net/codes/php/demo/compte-a-rebours             */

/*******************************************************************************
    * A parametrer
    ***************************************************************************/

$heures   = 15;  // les heures < 24
$minutes  = 2;   // les minutes  < 60
$secondes = 22;  // les secondes  < 60

$annee = date("Y");  // par defaut cette année
$mois  = date("m");  // par defaut ce mois
$jour  = date("d");  // par defaut aujourd'hui

// quand le compteur arrive à 0
// -> redirection
$redirection = 'https://phpsources.net/code_s.php?id=493';

/*******************************************************************************
    * calcul des secondes
    ***************************************************************************/

$secondes = mktime(date("H") + $heures,
                            date("i") + $minutes,
                            date("s") + $secondes,
                            $mois,
                            $jour,
                            $annee
                            ) - time();
?>

<html>
<head>
<title>Demo compte a rebour</title>
<script type="text/javascript">
var temps = <?php echo $secondes;?>;
var timer =setInterval('CompteaRebour()',1000);
function CompteaRebour(){

  temps-- ;
  j = parseInt(temps) ;
  h = parseInt(temps/3600) ;
  m = parseInt((temps%3600)/60) ;
  s = parseInt((temps%3600)%60) ;
  document.getElementById('minutes').innerHTML= (h<10 ? "0"+h : h) + '  h :  ' +
                                                (m<10 ? "0"+m : m) + ' mn : ' +
                                                (s<10 ? "0"+s : s) + ' s ';
if ((s == 0 && m ==0 && h ==0)) {
   clearInterval(timer);
   url = "<?php echo $redirection;?>"
   Redirection(url)
}
}
function Redirection(url) {
setTimeout("window.location=url", 500)
}
</script>
</head>

<body onload="timer">
<?php
// la condition est que le nombre de seconde soit etre superieur a 24 heures
if ($secondes <= 3600*24) {
?>
<span style="font-size: 36px;">Il vous reste comme temps</span>
<div id="minutes" style="font-size: 36px;"></div></span>
<?php
 }
?>
<body>
<html>

Fonctions du code I Doc officielle PHP

php.net	Description	Versions PHP
date	Formate une date/heure locale	PHP 4, PHP 5, PHP 7

echo	Affiche une chaîne de caractères	PHP 4, PHP 5, PHP 7

mktime	Retourne le timestamp UNIX d'une date	PHP 4, PHP 5, PHP 7

time	Retourne le timestamp UNIX actuel	PHP 4, PHP 5, PHP 7

Dites merci à l'auteur pour son partage, ça ne coûte rien et ça fait toujours plaisir

[9]

Invité
19 Aout 2019 à 13:49
Parfait ce code exactement ce je cherchais
Invité
26 Aout 2018 à 09:40
Bonjour,
Comment est-ce que je peux adapter ce code sur une page ou je n'ai accès qu'à des fonctions html? J'ai la possibilité de mettre une balise sur la page ou bien un code d'entête... D'avance merci! ça fait des jours et des nuits que je cherche la solution, votre code à l'air parfait mais je n'arrive pas à l'adapter...
Invité
30 Sept 2017 à 10:27
Bonjour votre srcipt fonctionne bien par contre quand on actualise ou qu'on change de page et qu'on reviens le compte à rebours recommence depuis le début comment peut-on faire pour empêcher celà ??? merci d'avance
Invité
14 Sept 2011 à 15:22
Bonjour, > serait-il possible de faire quelque chose d'équivalent, mais avec l'heure du serveur ? Toutes les heures, le chronomètre de réinitialise...
Invité
25 Déc 2010 à 22:50
Merci sa marche impec,
Invité
07 Déc 2010 à 18:04
merci bccc... et BRAVO
Invité
25 Mars 2009 à 14:18
Merci beaucoup pour le code, il est super clair et très facile à modifier à sa guise.
KOogar
02 Fév 2009 à 14:19
Oui, j'y avais pensé, mais vu que les codes sont déjà présent sur le site, je ne voulais pas faire doublon:
Calculer le temps restant ou le temps ecoulé
Calcul la différence de jour entre 2 dates
L'adaptation ne devait pas poser de probleme. On peut declencher le compte a rebourd avant, pour le faire il faut modifier la ligne 88 : if ($secondes <= 3600*24)
Par exemple pour le déclencher 5 jours avant:

Code:
if ($secondes <= 3600*24*5)
Invité
02 Fév 2009 à 13:44
Ce serait tipTop de pouvoir mettre en option l'affiche du nombre de jours restants.