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.

code source classé dans Applications

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&eacute;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 - Doc officielle PHP

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

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

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

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

Dites merci aux auteurs pour leurs travail, ça ne coûte rien et ça fait toujours plaisir

[20]

Invité
24 Aout 2023 à 21:21
Merci aux auteurs
Invité
11 Nov 2022 à 15:46
Un extrait de code visiblement compréhensif! merci pour le partage
Invité
25 Avril 2022 à 08:00
Merci beaucoup ça marche super bien :)
Invité
13 Fév 2022 à 06:09
Merci pour ce code, c'est trés utile
Invité
31 Déc 2021 à 15:29
Bonsoir PHP SOURCES. S'il te plait, je voudrais fixer le décompte pour que même lorsqu'on rafraichise la page, le décompte ne repart pas au debut.

Genre, le décompte sur mon site officielle seras la meme partout.
Merci bien.
Invité
13 Mai 2021 à 21:50
Merci de ce bout de code, ça me rappel de l'un de mes exercices que j'avais eu à faire quand j'apprenais à faire un CHRONO.
Invité
17 Jan 2021 à 15:42
Merci pour ce bout de code. Il m'épargne de longues heures de réflexion !!
Invité
09 Sept 2020 à 01:27
Bonjour, Super merci! Est il possible de le modifier pour ne pas avoir de limite de 24h? 0:-)
Invité
04 Juil 2020 à 16:46
cbon vraiment Merci!!!!!!
Invité
25 Mai 2020 à 13:06
Bonjour un grand merci a vous grand chef du code PHP et JAVASCRIPT .,longue vie au programmeur !!
Invité
08 Avril 2020 à 14:32
Excellent ce mélange de PHP et JavaScript, Merci Koogar ;)
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.