Compte à rebours pour événement

Soyez le premier à donner votre avis sur cette source.

Snippet vu 32 299 fois - Téléchargée 18 fois

Contenu du snippet

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 / Exemple :


<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>

A voir également

Ajouter un commentaire Commentaires
lakichemole Messages postés 253 Date d'inscription vendredi 13 juin 2003 Statut Membre Dernière intervention 18 mai 2009
13 mai 2008 à 10:29
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? :)
CSIBern Messages postés 44 Date d'inscription dimanche 3 décembre 2000 Statut Membre Dernière intervention 21 mai 2014
13 mai 2008 à 16:59
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.
Sat119 Messages postés 18 Date d'inscription mardi 22 juillet 2008 Statut Membre Dernière intervention 12 décembre 2013
22 juil. 2008 à 11:12
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
Dav_c Messages postés 194 Date d'inscription dimanche 25 janvier 2004 Statut Membre Dernière intervention 11 décembre 2015
20 déc. 2009 à 17:00
vendu ;)
seblechinois Messages postés 72 Date d'inscription mercredi 27 décembre 2000 Statut Membre Dernière intervention 16 mai 2016 1
15 mai 2010 à 11:01
Bonjour,
merci pour cette source! ça marche nickel sauf sous google chrome...
var sec = NaN ???
a voir!

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.