begin process at 2012 02 14 10:32:29
  Trouver un code source :
 
dans
 
Accueil > 

Code

 > 

Date & Heure

 > COMPTE À REBOURS POUR ÉVÉNEMENT

COMPTE À REBOURS POUR ÉVÉNEMENT


 Information sur la source

Note :
9 / 10 - par 3 personnes
9,00 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10
Catégorie :Date & Heure Classé sous :compte, rebours, date, heure, tache Niveau :Débutant Date de création :10/05/2008 Date de mise à jour :13/05/2008 19:01:42 Vu :23 272

Auteur : CSIBern

Ecrire un message privé
Site perso
Commentaire sur cette source (48)
Ajouter un commentaire et/ou une note

 Description

Petit script de compte à rebours pouvant mentionner le nombre de jours, d'heures, de minutes et de secondes restantes.
De plus, il offre un message différent une fois l'événement en cours ou dépassé.
Enfin, le compte à rebours est aussi inscrit dans la barre des tâches.

Code à placer dans la balise <BODY></BODY> à l'emplacement voulu.
Le code n'a volontairement pas été simplifié pour comprendre les différentes étapes.

Ah, et si vous le souhaitez, c'est pour un tournois international de baseball à Monthey en Suisse en septembre 2008 alors vous pouvez venir faire un tour ;o)

Source

  • <label id="Compte"></label>
  • <script type="text/JavaScript">
  • var Affiche=document.getElementById("Compte");
  • function Rebour() {
  • var date1 = new Date();
  • var date2 = new Date ("Sep 5 17:00:00 2008"); // Date et heure de l'événement
  • var sec = (date2 - date1) / 1000; // Temps donné en millièmes de seconde
  • var n = 24 * 3600; //nombre de secondes dans un jour
  • if (sec > 0) {
  • j = Math.floor (sec / n);
  • h = Math.floor ((sec - (j * n)) / 3600);
  • mn = Math.floor ((sec - ((j * n + h * 3600))) / 60);
  • sec = Math.floor (sec - ((j * n + h * 3600 + mn * 60)));
  • Affiche.innerHTML = "Temps restant : " + j +" jours, "+ h +" h "+ mn +" min et "+ sec + " sec ";
  • window.status = "Temps restant : " + j +" jours, "+ h +" h "+ mn +" min et "+ sec + " sec ";
  • }
  • else if (Math.abs(sec) < (3 * n)) { // Durée de l'événement
  • Affiche.innerHTML = "Temps restant : Le tournoi est en cours, venez profiter du spectacle";
  • window.status = "Temps restant : Le tournoi est en cours, venez profiter du spectacle";
  • }
  • else {
  • Affiche.innerHTML = "Temps restant : Le tournoi est terminé, retrouvez toutes les informations sur le site";
  • window.status = "Temps restant : Le tournoi est terminé, retrouvez toutes les informations sur le site";
  • }
  • tRebour=setTimeout ("Rebour();", 1000);
  • }
  • Rebour();
  • </script>
<label id="Compte"></label>
<script type="text/JavaScript">
var Affiche=document.getElementById("Compte");
function Rebour() {
var date1 = new Date();
var date2 = new Date ("Sep 5 17:00:00 2008"); // Date et heure de l'événement
var sec = (date2 - date1) / 1000; // Temps donné en millièmes de seconde
var n = 24 * 3600; //nombre de secondes dans un jour
if (sec > 0) {
    j = Math.floor (sec / n);
    h = Math.floor ((sec - (j * n)) / 3600);
    mn = Math.floor ((sec - ((j * n + h * 3600))) / 60);
    sec = Math.floor (sec - ((j * n + h * 3600 + mn * 60)));
    Affiche.innerHTML = "Temps restant : " + j +" jours, "+ h +" h "+ mn +" min et "+ sec + " sec ";
    window.status = "Temps restant : " + j +" jours, "+ h +" h "+ mn +" min et "+ sec + " sec ";
}
else if (Math.abs(sec) < (3 * n)) { // Durée de l'événement
    Affiche.innerHTML = "Temps restant : Le tournoi est en cours, venez profiter du spectacle";
    window.status = "Temps restant : Le tournoi est en cours, venez profiter du spectacle";
}
else {
    Affiche.innerHTML = "Temps restant : Le tournoi est terminé, retrouvez toutes les informations sur le site";
    window.status = "Temps restant : Le tournoi est terminé, retrouvez toutes les informations sur le site";
}

tRebour=setTimeout ("Rebour();", 1000);
}
Rebour();
</script>



 Historique

10 mai 2008 10:44:13 :
Oublie dans la description
10 mai 2008 12:50:42 :
Correction par Bultez permettant au compte à rebours d'être live et de placer entièrement le code dans la balise <BODY>
10 mai 2008 12:52:46 :
Modification description
13 mai 2008 19:01:42 :
Simplification du code

 Sources du même auteur

COMPTE À REBOURS POUR ÉVÉNEMENTS À RÉPÉTITION
Source avec Zip Source avec une capture STRIKER BASEBALL

 Sources de la même categorie

Source avec Zip CALENDRIER ANNUEL UNIVERSEL AVEC SAINTS DU CALENDRIER ET FÊT... par 007Julien
OBTENIR LE NOMBRE DE JOURS D'UN MOIS SUIVANT SON ANNÉE par hugolegrand
SAINT DU JOUR par tefa24600
Source avec Zip Source avec une capture NIPCLOCK 1.2 par neep
COMPTE À REBOURS POUR ÉVÉNEMENTS À RÉPÉTITION par CSIBern

 Sources en rapport avec celle ci

Source avec Zip Source avec une capture NIPCLOCK 1.2 par neep
COMPTE À REBOURS POUR ÉVÉNEMENTS À RÉPÉTITION par CSIBern
Source avec Zip Source avec une capture HORLOGE TRIPLE AFFICHAGE AU FORMAT AM/PM/24H/DST par sofiane1234
Source avec Zip Source avec une capture HORLOGE NUMÉRIQUE EN JAVASCRIPT, COMPATIBLE IE ET FF par bad_dark_spirit
Source avec Zip HEURE, DATE DU JOUR DE L'INTERNAUTE ET FÊTE À SOUHAITER. par sneezy

Commentaires et avis

Commentaire de lakichemole le 13/05/2008 10:29:07

Petite question pourquoi dans ton code tu calcul une premièere fois les minute et les heures "mn = sec / 60;    h = mn /60;" si c'est pour les recalculer après ? C'était la première version? :)

Commentaire de CSIBern le 13/05/2008 16:59:07

En fait, la première fois je calcule le nombre de minutes (par exemple) totales restant jusqu'au moment m alors que la 2ème fois, c'est le nombre de minutes totales moins le nombre de minutes déjà comprises dans les heures et les jours. Le calcul pourrait bien évidemment être simplifié, mais pour des raisons personnelles de compréhension, j'ai préféré tout développer. A chacun sa méthode.

Merci de ton commentaire Lakichemole.

Commentaire de lakichemole le 13/05/2008 17:46:31

Non mais ok mais tu écris ça :
    mn = sec / 60;
    h = mn /60;
    j = Math.floor (sec / (24 * 3600));
    h = Math.floor ((sec - (j * 24 * 3600)) / 3600);
    mn = Math.floor ((sec - ((j * 24 * 3600 + h * 3600))) / 60);
On est d'accords que tu peux mettres les 2 première ligne en commentaire vu que tu ne t'en set part (pour tes calculs)?

Commentaire de CSIBern le 13/05/2008 18:55:00

Ah oui, c'est juste, je ne m'en étais même pas rendu compte, je te remercie et vais modifié ça de suite.

Commentaire de lakichemole le 14/05/2008 09:35:12

pas de problème :)

Commentaire de Sat119 le 22/07/2008 11:12:31 8/10

Salut ! Je suis une GRANDE débutante en HTML, genre le basique de chez basique.. mais je tente de me soigner ^^

J'ai deux questions..

La durée de ton évènement, le tournoi, c'est 3 jours, c'est ça ?

Si oui, comment tu exprimes une durée égale à 45 min, voire 1h ?

Et ensuite, est-ce qu'il y a un moyen d'intégrer plusieurs comptes à rebour, avec différents éléments ? parce que quand je le répète, le seul compte à rebour qui s'affiche est le dernier exprimé..

Merci :D

Commentaire de lakichemole le 22/07/2008 12:18:09

Salut il n'est jamais trop tard pour s'y mettre :).
Ce code n'est en effet pas très générique je viens de le modifier pour qu'il le soit un peu plus, cependant la status bar n'est plus utilisable correctement):
<html><body>
<label id="Compte"></label><br />
<label id="Compte2"></label><br />
<label id="Compte3"></label><br />
<script type="text/JavaScript">
window.status="";
function Rebour(LabelId,DateEvenement,TextEncours,TextTermine) {
var Affiche=document.getElementById(LabelId);
var date1 = new Date();
var date2 = new Date (DateEvenement); // Date et heure de l'événement
var sec = (date2 - date1) / 1000; // Temps donné en millièmes de seconde
var n = 24 * 3600; //nombre de secondes dans un jour
if (sec > 0) {
j = Math.floor (sec / n);
h = Math.floor ((sec - (j * n)) / 3600);
mn = Math.floor ((sec - ((j * n + h * 3600))) / 60);
sec = Math.floor (sec - ((j * n + h * 3600 + mn * 60)));
Affiche.innerHTML = "Temps restant : " + j +" jours, "+ h +" h "+ mn +" min et "+ sec + " sec ";
window.status = "Temps restant : " + j +" jours, "+ h +" h "+ mn +" min et "+ sec + " sec ";
}
else if (Math.abs(sec) < (3 * n)) { // Durée de l'événement
Affiche.innerHTML = TextEncours;
window.status += TextEncours;
}
else {
Affiche.innerHTML = TextTermine;
window.status += TextTermine;
}
    
tRebour=setTimeout ("Rebour('" + LabelId + "','" + DateEvenement + "','" + TextEncours + "','" + TextTermine + "');", 1000);
}
Rebour("Compte","Sep 5 17:00:00 2008","Compeur 1,temps restant : Le tournoi est en cours, venez profiter du spectacle","Temps restant : Le tournoi est terminé, retrouvez toutes les informations sur le site");
Rebour("Compte2","Sep 4 10:00:00 2008","Compeur 2,temps restant : Le tournoi est en cours, venez profiter du spectacle","Temps restant : Le tournoi est terminé, retrouvez toutes les informations sur le site");
Rebour("Compte3","Jun 2 19:00:00 2009","Compeur 3,temps restant : Le tournoi est en cours, venez profiter du spectacle","Temps restant : Le tournoi est terminé, retrouvez toutes les informations sur le site");
</script>
</body>
</html>

Commentaire de Sat119 le 22/07/2008 12:50:57

Euh.. ok ?  ^^

ça répond à une de mes questions ? parce que dans ce cas, je comprend pas la réponse.. :S

En gros, je voudrais établir 4 comptes à rebour. 4 dates différentes. Tous les évènements durant à peu près une heure et étant complètement indépendants les uns des autres.


Commentaire de lakichemole le 22/07/2008 14:16:42

Oui en fait le code que je viens de te donner test le (copie colle dans un fichier html et ouvre le fichier avec IE ).
Et dans ce code j'ai montrer un exemple avec 3 compte à rebours avec 3 date différentes etc :)
- Compte a rebours 1 (à associer à <label id="Compte"></label>:
Rebour("Compte","Sep 5 17:00:00 2008","Compeur 1,temps restant : Le tournoi est en cours, venez profiter du spectacle","Temps restant : Le tournoi est terminé, retrouvez toutes les informations sur le site");

- Compte a rebours 2 (à associer à <label id="Compte2"></label>:
Rebour("Compte2","Sep 4 10:00:00 2008","Compeur 2,temps restant : Le tournoi est en cours, venez profiter du spectacle","Temps restant : Le tournoi est terminé, retrouvez toutes les informations sur le site");

- Etc..

Commentaire de Sat119 le 22/07/2008 14:49:10

Alors oui effectivement, ça donne 3 comptes à rebour, mais tous liés au même intitulé évènements

Commentaire de lakichemole le 22/07/2008 15:06:19

Je ne comprend pas se que tu veut changer; on est d'accord que mes 3 compte a rebours sont paramétrable de la facon suivante :
- Etape 1 : tu crée un objet HTML avec un id unique que tu insère n'importe ou dans ta page  ex:<label id="MonComptePerso" ></label>

- Etape 2 : Entre les balises script et après la fonction Rebour() tu lance ton compte à rebour de la facon suivante Rebour(LabelId,DateEvenement,TextEncours,TextTermine); ex:
      Rebour("MonComptePerso","Sep 4 10:00:00 2008","traitement en cours","traitement terminé")

Libre à toi d'ajouter/supprimer des compte à rebour et de personalisé leur création via les paramètres

Commentaire de Sat119 le 22/07/2008 15:21:44

je verrais ça ce soir, il faut que j'aille au boulot là, merci en tout cas et je te tiens au courant

Commentaire de lakichemole le 22/07/2008 15:31:54

Ok :)

Commentaire de Sat119 le 22/07/2008 23:00:23

je comprend pas.. j'ai tenté de faire des modifs .. en gros je veux annoncer sur le forum de Grey's Anatomy et Private Practice que j'administre, quand les premiers épisodes des nouvelles saisons vont être diffusés..

où est-ce que j'ai faux ? parce que sur ma page test, là où avec ton code il y avait au moins les comptes à rebours qui s'affichaient, là y a plus rien..

<html><body>
<label id="Diffusion aux USA, Grey's Anatomy, Saison 5, Premier Episode"></label><br />
<label id="Compte2"></label><br />
<label id="Compte3"></label><br />
<script type="text/JavaScript">
window.status="";
function Rebour(LabelId,DateEvenement,TextEncours,TextTermine) {
var Affiche=document.getElementById(LabelId);
var date1 = new Date();
var date2 = new Date (Sep 26 03:00:00 2008); // Date et heure de l'événement
var sec = (date2 - date1) / 1000; // Temps donné en millièmes de seconde
var n = 24 * 3600; //nombre de secondes dans un jour
if (sec > 0) {
j = Math.floor (sec / n);
h = Math.floor ((sec - (j * n)) / 3600);
mn = Math.floor ((sec - ((j * n + h * 3600))) / 60);
sec = Math.floor (sec - ((j * n + h * 3600 + mn * 60)));
Affiche.innerHTML = "Temps restant : " + j +" jours, "+ h +" h "+ mn +" min et "+ sec + " sec ";
window.status = "Temps restant : " + j +" jours, "+ h +" h "+ mn +" min et "+ sec + " sec ";
}
else if (Math.abs(sec) < (3 * n)) { // Durée de l'événement
Affiche.innerHTML = TextEncours;
window.status += TextEncours;
}
else {
Affiche.innerHTML = TextTermine;
window.status += TextTermine;
}
    
tRebour=setTimeout ("Rebour('" + LabelId + "','" + DateEvenement + "','" + TextEncours + "','" + TextTermine + "');", 1000);
}
Rebour("Compte","Sep 26 03:00:00 2008","Grey's Anatomy, Premier Episode Saison 5 : l'épisode est en cours de diffusion","Grey's Anatomy, Saison 5, Premier Episode : L'épisode est terminé");
Rebour("Compte2","Sep 4 10:00:00 2008","Compeur 2,temps restant : Le tournoi est en cours, venez profiter du spectacle","Temps restant : Le tournoi est terminé, retrouvez toutes les informations sur le site");
Rebour("Compte3","Jun 2 19:00:00 2009","Compeur 3,temps restant : Le tournoi est en cours, venez profiter du spectacle","Temps restant : Le tournoi est terminé, retrouvez toutes les informations sur le site");
</script>
</body>
</html>

Commentaire de Sat119 le 23/07/2008 00:32:22

le truc c'est qu'il me semble que c'est cette partie qui défini l'affichage non ?

Affiche.innerHTML = "Temps restant : " + j +" jours, "+ h +" h "+ mn +" min et "+ sec + " sec ";
window.status = "Temps restant : " + j +" jours, "+ h +" h "+ mn +" min et "+ sec + " sec ";
}
else if (Math.abs(sec) < (3 * n)) { // Durée de l'événement
Affiche.innerHTML = TextEncours;
window.status += TextEncours;
}
else {
Affiche.innerHTML = TextTermine;
window.status += TextTermine;



et cette ligne :

else if (Math.abs(sec) < (3 * n)) { // Durée de l'événement

comment on fait pour que la durée de l'évènement soit de trois heures (à cause des fuseaux horaires, en tout ça fait trois heures..)

Commentaire de CSIBern le 23/07/2008 07:26:28

Salut Sat119,

Ton erreur (en tout cas la première essentielle qui saute aux yeux) vient du fait que ton nom de label (label id) ne correspond pas au premier paramètre de la fonction que tu appelles à la fin (Rebour("Compte",... ).

Tu dois remplacer (par exemple) à la deuxième ligne (le texte que tu mets là ne sera pas affiché dans ta page, c'est juste le nom d'un cadre)
<label id="Diffusion aux USA, Grey's Anatomy, Saison 5, Premier Episode"></label><br />
par
<label id="S5E1"></label><br />
et presque à la fin
Rebour("Compte","Sep 26 03:00:00 2008","Grey's Anatomy, Premier Episode Saison 5 : l'épisode est en cours de diffusion","Grey's Anatomy, Saison 5, Premier Episode : L'épisode est terminé");
par
Rebour("S5E1","Sep 26 03:00:00 2008","Grey's Anatomy, Premier Episode Saison 5 : l'épisode est en cours de diffusion","Grey's Anatomy, Saison 5, Premier Episode : L'épisode est terminé");
Ainsi tu retrouves à ces 2 places le même nom pour le cadre, soit "S5E1".

Enfin, pour la durée, le "n" que j'introduis correspond au nombre de seconde dans un jour. Si tu veux que ça ne corresponde qu'à 3 heures, tu peux introduire à la place de 3*n 3*60*60, soit 10800, et tu devrais obtenir le bon résultat.

Enfin, je tiens à remercier lakichemole pour avoir transformé mon script en programme (ce qui te permet aujourd'hui de placer plusieurs comptes à rebours dans la même page) et pour les quelques corrections du départ.

Commentaire de lakichemole le 23/07/2008 09:12:55

Pas de problème :)

Commentaire de Sat119 le 23/07/2008 13:29:02

Le programme de lakichemolle donne un affichage tel que celui ci :

temps restant : temps qui défile
temps restant : temps qui défile
temps restant : temps qui défile

je voulais mettre à la place de temps restant première ligne, "Diffusion aux USA GREY'S ANATOMY, Saison 5 Episode 1"
sur la deuxième ligne, "Diffusion PP.. Saison 2.."

Car les comptes à rebour seront placés sur l'index directement.
En fait je cherche à définir à quoi se rapportent les comptes à rebour, d'où le long label id.

est-ce possible ?

Commentaire de Sat119 le 23/07/2008 13:33:07

et en modifiant le label id comme tu me le notes, l'affichage n'apparait pas non plus

Commentaire de lakichemole le 23/07/2008 13:51:59

ok je vais te prémarcher le travail en te donnant exactement se que tu doit coller donc pour le premier compte à rebours c'est bon pour le 2 eme 3eme tu veux quoi?

Commentaire de Sat119 le 23/07/2008 14:03:50

il y en a 4

Diffusion aux USA, Grey's Anatomy, Saison 5, Premier Episode
Diffusion aux USA, Private Practice, Saison 2, Premier Episode
Diffusion en France, Grey's Anatomy, Saison 4, Premier Episode
Diffusion en France, Private Practice, Saison 1, Premier Episode

j'ai hâte de comprendre

Commentaire de lakichemole le 23/07/2008 14:45:32

et les dates ??

Commentaire de Sat119 le 23/07/2008 14:53:32

pour les dernières lignes je ne sais pas encore, je les modifirais moi même c'est bon

pour la première Sept 26 03:00:00 2008
deuxième Oct 02 03:00:00 2008

Commentaire de lakichemole le 23/07/2008 15:03:03

et voilà si avec ça t'y arrive pas je sais plus quoi faire :D (j'ai encore changer le code pour que se soit un peut plus simple):

<html><body>
<label id="Compte1"></label><br />
<label id="Compte2"></label><br />
<label id="Compte3"></label><br />
<label id="Compte4"></label><br />
<script type="text/JavaScript">
window.status="";
function Rebour(LabelId,DateEvenement,Text) {
var Affiche=document.getElementById(LabelId);
var date1 = new Date();
var date2 = new Date (DateEvenement); // Date et heure de l'événement
var sec = (date2 - date1) / 1000; // Temps donné en millièmes de seconde
var n = 24 * 3600; //nombre de secondes dans un jour
if (sec > 0) {
j = Math.floor (sec / n);
h = Math.floor ((sec - (j * n)) / 3600);
mn = Math.floor ((sec - ((j * n + h * 3600))) / 60);
sec = Math.floor (sec - ((j * n + h * 3600 + mn * 60)));
Affiche.innerHTML = unescape(Text) + " temps restant : " + j +" jours, "+ h +" h "+ mn +" min et "+ sec + " sec ";
//window.status = unescape(Text) + " temps restant : " + j +" jours, "+ h +" h "+ mn +" min et "+ sec + " sec ";
}
else if (Math.abs(sec) < (3 * n)) { // Durée de l'événement
Affiche.innerHTML = unescape(Text) + " en cours";
//window.status += unescape(Text) + " en cours";
}
else {
Affiche.innerHTML = unescape(Text) + " terminé";
//window.status += unescape(Text) + " terminé";
}
    
tRebour=setTimeout ("Rebour('" + LabelId + "','" + DateEvenement + "','" + Text + "');", 1000);
}
Rebour("Compte1","Sept 26 03:00:00 2008",escape("Diffusion aux USA, Grey's Anatomy, Saison 5, Premier Episode"));
Rebour("Compte2","Oct 02 03:00:00 2008","Diffusion aux USA, Private Practice, Saison 2, Premier Episode");
Rebour("Compte3","Sep 26 03:00:00 2008",escape("Diffusion en France, Grey's Anatomy, Saison 4, Premier Episode"));
Rebour("Compte4","Sep 26 03:00:00 2008","Diffusion en France, Private Practice, Saison 1, Premier Episode");

</script>
</body>
</html>

Commentaire de Sat119 le 23/07/2008 15:11:33

ça marche merci beaucoup, et dis moi, elle sert à quoi la commande escape ?

Commentaire de lakichemole le 23/07/2008 15:17:00

la commande escape est utile quand il y a des caractère spéciaux dans ta chaine de caractère ici tu avait une ' dans Grey's anatomy.
Donc à chaque fois que tu as des caractère spécieux dans ta chaine tu l'utilise :) (tu peux l'utiliser tout le temps ça mange pas de pain comme qui dirais)

Commentaire de Sat119 le 23/07/2008 15:30:39

Okay c'est cool et donc au final comme les épisodes en France ne feront qu'une heure niveau durée de diffusion, je vais prendre le fuseau horaire de New York, donc 3h du mat' chez nous, avec une durée d'une heure aussi, ou peut être faire NYC et LA 3h et 6h,

mais donc pour afficher la durée d'une heure, et non de 3, c'est (1*60*60) c'est ça ?

et si on avait inscrit Grey\'s Anatomy, ça fonctionnait de la même façon qu'escape non ?

Merci en tout cas pour ta patience.. comme je l'ai dit, ça doit faire moins de deux semaines que ça me toque le Javascript

Commentaire de CSIBern le 23/07/2008 16:05:47

Ne t'en fais pas, ça viendra avec le temps, enfin j'espère. Pour moi, ce script était aussi mon premier (et le seul pour l'instant).

Pour la durée c'est correcte, mais tu peux aussi noté directement 3600 ;o).

Pour le \' je sais pas, lakichemole pourra certainement mieux te renseigner que moi, mais j'ai des doutes.

Je me pose quand même la question de pourquoi la réponse que j'avais donné avant ne fonctionne pas, j'avais oublié quelque chose (si ce n'est le escape, fonction que je ne connaissais pas) ?

Commentaire de lakichemole le 23/07/2008 16:06:47

Et hop encore une nouvelle version, dans celle ci le 2 ème paramètre passé correspond à la date de fin d'évènement :

<html><body>
<label id="Compte1"></label><br />
<label id="Compte2"></label><br />
<label id="Compte3"></label><br />
<label id="Compte4"></label><br />
<script type="text/JavaScript">
window.status="";
function Rebour(LabelId,DateEvenement,DateFinEvenement,Text) {
var Affiche=document.getElementById(LabelId);
var date1 = new Date();
var date2 = new Date (DateEvenement); // Date et heure de l'événement
var date3 = new Date (DateFinEvenement); // Date et heure de la fin de l'événement
var sec = (date2 - date1) / 1000; // Temps donné en millièmes de seconde
var TempsRestant=(date3-date1);
var n = 24 * 3600; //nombre de secondes dans un jour
if (sec > 0) {
j = Math.floor (sec / n);
h = Math.floor ((sec - (j * n)) / 3600);
mn = Math.floor ((sec - ((j * n + h * 3600))) / 60);
sec = Math.floor (sec - ((j * n + h * 3600 + mn * 60)));
Affiche.innerHTML = unescape(Text) + " temps restant : " + j +" jours, "+ h +" h "+ mn +" min et "+ sec + " sec ";
//window.status = unescape(Text) + " temps restant : " + j +" jours, "+ h +" h "+ mn +" min et "+ sec + " sec ";
}
else if (Math.abs(sec) < TempsRestant ) { // Durée de l'événement
Affiche.innerHTML = unescape(Text) + " en cours";
//window.status += unescape(Text) + " en cours";
}
else {
Affiche.innerHTML = unescape(Text) + " terminé";
//window.status += unescape(Text) + " terminé";
}
    
tRebour=setTimeout ("Rebour('" + LabelId + "','" + DateEvenement + "','" + DateFinEvenement + "','" + Text + "');", 1000);
}
Rebour("Compte1","Sep 26 03:00:00 2008","Sep 26 04:00:00 2008",escape("Diffusion aux USA, Grey's Anatomy, Saison 5, Premier Episode"));
Rebour("Compte2","Oct 02 03:00:00 2008","Oct 02 04:00:00 2008","Diffusion aux USA, Private Practice, Saison 2, Premier Episode");
Rebour("Compte3","Sep 26 03:00:00 2008","Sep 26 04:00:00 2008",escape("Diffusion en France, Grey's Anatomy, Saison 4, Premier Episode"));
Rebour("Compte4","Sep 26 03:00:00 2008","Sep 26 04:00:00 2008","Diffusion en France, Private Practice, Saison 1, Premier Episode");

</script>
</body>
</html>

Commentaire de Sat119 le 23/07/2008 16:14:17

géant merci je vais faire les modifs

Commentaire de lakichemole le 23/07/2008 16:14:49

A oui et pour le "\" ça marche pour le premier appel mais pas dans l'appel du setTimeOut

Commentaire de gegeloire42 le 20/04/2009 11:30:11

Pas mal....

Commentaire de lakichemole le 20/04/2009 11:49:17

Si c'est pas mal met une note :)

Commentaire de JulienB76 le 03/09/2009 08:26:56

Ce script fonctionne t-il sous internet explorer 7 ? Je n'ai rien qui s'affiche contrairement à firefox. Merci en tous cas !

Commentaire de Dav_c le 20/12/2009 17:00:03 10/10

vendu ;)

Commentaire de Beuze14 le 09/04/2010 10:33:17

Salut,
je reviens sur ce sujet parce que je n'arrive pas à trouver une solution à mon problème.

j'aimerais savoir comment faire pour faire afficher un "0" lorsque les heures, jours, minutes et secondes sont inférieures à 10 (ex: 08 jours 09 h 05 min et 04 sec). Lorsque les chiffres passent en dessous de 10 tout se décale et du coup ça perturbe ma mise en page.
Je ne suis pas très fort en code javascript. J'ai essayé quelques truc mais sans succès. Quelqu'un peut-il me trouver une solution ?
Merci de votre aide.

Commentaire de CSIBern le 09/04/2010 11:07:57

Salut Beuze14,

La gestion des nombres ne permet pas d'avoir un zéro avant les chiffres. Pour cela, tu dois transformer tes nombres en charactères. tu pourrais faire une fonction du style :

function ajoute_zero (nombre) {
  if (nombre < 10) {
    nombre = "0" + nombre;
  }
}

Je n'ai pas vérifié cette fonciton, mais il te faudra peut-être juste une fonction transformant ton nombre en string (mais à priori ça ne devrait pas poser de problème).

Bonne programmation

Commentaire de Beuze14 le 09/04/2010 11:31:28

Alors je comprends bien l'utilité de cette fonction mais comment faire reconnaître que "nombre" est égal aux valeurs "j", "h", "mn" et "sec" sachant qu'il faille définir j<0, h<0, mn<0 et sec<0.

Je débute en programmation et j'imagine bien "dans ma tête" ce que cela doit donner mais le programmer là, "je nage" ;)

Commentaire de CSIBern le 09/04/2010 13:41:22

J'ai juste oublié de mettre un return dans la fonction. Ca donnerait donc :

function ajoute_zero (nombre) {
  if (nombre < 10) {
    nombre = "0" + nombre;    
  }
  return nombre;
}

ainsi tu pourras utiliser la fonction comme suit :
Dans la fonction rebour remplacer : Temps restant : " + j + ...
par Temps restant : " + ajoute_zero (j) +

J'espère que je n'ai pas fait d'erreur, ça fait longtemps que je n'ai plus programmé en javascript, mais l'idée est que la fonction retourne un nombre + "0" si il est inférieur à 10 et le nombre entré dans le cas contraire. La fonction remplace donc le nombre

Commentaire de Beuze14 le 12/04/2010 08:50:17

Merci CSIBern, ça marche nikel. Encore merci pour ton aide.

Commentaire de CSIBern le 12/04/2010 09:32:43

Pas de soucis, ravis d'avoir pu aider.

Commentaire de nattydreadlocks le 02/05/2010 19:25:53

Bonjour,

Voilà je souhaite désespérément une solution au probleme suivant:

Je cherche un compte à rebours, comme le tiens mais qui fonctionnerait sur une duréé (et non pas sur une date future).

Je m'explique:

J'ai besoin que le compte à rebours commence le vendredi à minuit et s'arrête 15 jours plus tard (vendredi à minuit) pour recommencer à nouveau un cicle de 15 jours, .. et ainsi de suite...

Pourrais tu m'aider?

Commentaire de CSIBern le 02/05/2010 19:44:34

Salut,

Désolé, mais il ne sera pas possible d'adapter ce programme à ce que tu veux, il faudrait en réécrire tout un nouveau. Je n'aurai pas le temps de le faire, il faudra donc que tu t'y attèles seul. Tu pourras quand même t'inspirer du présent programme pour rédiger le nouveau.

Bonne chance et redis-moi si t'as besoin d'un coup de main

Commentaire de nattydreadlocks le 02/05/2010 19:57:49

ok je comprend... Le truc c'est que je n'y connais pas grand chose et je ne trouve pas de tutoriel ou ressource adaptée à ce que je cherche. Saurais-tu me donner une piste?

Commentaire de nattydreadlocks le 03/05/2010 18:51:06

salut salut bon j'ai trouvé une solution pour utiliser ton script. le problème c'est que j'ai besoin de récupérer un variable que j'ai défini en phpdonc voilà ce que j'ai tenté

<script type="text/JavaScript">
window.status="";
function Rebour(LabelId,DateEvenement,DateFinEvenement,Text) {
var Affiche=document.getElementById(LabelId);
var date1 = new Date();
var date2 = new Date (DateEvenement); // Date et heure de l'événement
var date3 = new Date (DateFinEvenement); // Date et heure de la fin de l'événement
var sec = (date2 - date1) / 1000; // Temps donné en millièmes de seconde
var TempsRestant=(date3-date1);
var n = 24 * 3600; //nombre de secondes dans un jour

if (sec > 0) {
j = Math.floor (sec / n);
h = Math.floor ((sec - (j * n)) / 3600);
mn = Math.floor ((sec - ((j * n + h * 3600))) / 60);
sec = Math.floor (sec - ((j * n + h * 3600 + mn * 60)));
Affiche.innerHTML = unescape(Text) + " temps restant : " + j +" jours, "+ h +" h "+ mn +" min et "+ sec + " sec ";
//window.status = unescape(Text) + " temps restant : " + j +" jours, "+ h +" h "+ mn +" min et "+ sec + " sec ";
}
else if (Math.abs(sec) < TempsRestant ) { // Durée de l'événement
Affiche.innerHTML = unescape(Text) + " en cours";
//window.status += unescape(Text) + " en cours";
}
else {
Affiche.innerHTML = unescape(Text) + " terminé";
//window.status += unescape(Text) + " terminé";
}
    
tRebour=setTimeout ("Rebour('" + LabelId + "','" + DateEvenement + "','" + DateFinEvenement + "','" + Text + "');", 1000);
}
Rebour("Compte1", "<?php echo $date1; ?>" , "<?php echo $date2; ?>" , escape("Diffusion aux USA, Grey's Anatomy, Saison 5, Premier Episode"));

</script>

(ici on m'affiche que le'évènement est terminé hors j'ai etabli la date de depart au 8/05/2010)

J'ai également essayé de les insérer de la sorte:

var datedebut = "<?php echo $date1; ?>" ; // Date fin inscription (et début votes)
var datefin = "<?php echo $date2; ?>" ; // Date fin votes

Rebour("Compte1", + datedebut + , + datefin + , escape("Diffusion aux USA, Grey's Anatomy, Saison 5, Premier Episode"))

Mais là plus rien ne s'affiche

Je supose qu'il s'agit d'une erreur de syntaxe mais je ne vois pas comment faire.

(pr info les dates sont
May 08 19:15:45 2010 et May 17 19:15:45 2010)

Commentaire de CSIBern le 05/05/2010 00:43:33

Salut nattydreadlocks,

J'ai voulu t'aider dans ton problème en créant un code à partir du début. Cependant, vers la fin, je me suis rendu compte que j'avais peut-être mal compris ta question.

Le nouveau code, tu pourras le trouver ici : http://www.javascriptfr.com/codes/COMPTE-REBOURS-EVENEMENTS-REPETITION_51728.aspx.

Dis-moi s'il t'est quand même utile.

Bon courage

Commentaire de seblechinois le 15/05/2010 11:01:49 9/10

Bonjour,
merci pour cette source! ça marche nickel sauf sous google chrome...
var sec = NaN ???
a voir!

Commentaire de seblechinois le 15/05/2010 11:14:01

Re,
J'ai corrigé le problème :
var date2 = new Date (2010,4,22,14,30,00);
ça marche avec IE, FF et google chrome

/!\ Pour le mois 0=janvier; 1=février

 Ajouter un commentaire


Discussions en rapport avec ce code source dans le forum

créer un compte à rebours à l'heure du serveur [ par ajor ] Bonjour à tous,J'aimerais pour mon site, créer un compte à rebours qui fonctionne à l'heure du serveur, afin que tous les client aient exactement le m Pb compte rebour dynamique [ par hashut ] Bonjour j'ai un blem sur un compte rebours quand je suis en millisecondes le compte rebours fonctionne bien mais des c-que je formate la date en heure Compte a rebours [ par youvalcsharpp ] Bonsoir, Comment faire un compte a rebours dynamique en js ! Je soihaite aller de 45minutes jusqu'a 0 secondes et 0 reediriger ! Mercii Merci beauc compte à rebours avec changement d'image [ par ravid87 ] Bonsoir, voila j'ai un petit problème, le grand maître Yoogle n'a pas su me répondre précisément [^^sad1], enfaite je voudrais intégrer une image qui Compte a rebours pour mon site [ par jim0907 ] Bonjour, Cela fait plusieurs jour que je cherche sur internet un compte a rebours pour mon site, je ne trouve pas du tout ce qu'il me faut alors j'ai compte a rebours en html [ par cashloic ] Bonjour je voudrais mettre un compte a rebours dans mon forum mais qui ne supporte que le code html et je n'arrive pas à en trouver un !Merci de me do heure et date [ par jamelzzz ] bonjour;je veux lorsque on clique il  s'affiche l'heure de mon pc.sachant que j'ai deux formulaire l'une pour date de debut  et  l'autre pour date fin comment formater lorsqu'on saisie une date et l'heure [ par machmacha ] bonjour tout le monde,j'ai un petit problème sur le formatage d'un champ qui contient une date + l'heure j'expose mon problème: <img src="file:///C: decalage date/heure serveur et marchine [ par laubro ] Bonjourj'ai trouvé un petit script sympas de compte a rebourg ici mais je bloque sur l'écart entre l'heure serveur et l'heure de la machine, en effet compte a rebours [ par valkerio ] bonjour voila j'ai trouve un petit script sur ce site mais je voudrais bien un peu le modifier mais je ne connais pas grand chose en javascript. donc


Nos sponsors


Sondage...

Comparez les prix

CalendriCode

Février 2012
LMMJVSD
  12345
6789101112
13141516171819
20212223242526
272829    

Consulter la suite du CalendriCode

Photothèque

 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 2,200 sec (4)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales