[js] Compte à rebours

Utilisateur anonyme -  
dreamfeeder Messages postés 253 Date d'inscription   Statut Membre Dernière intervention   -
Bonjour,
J'ai trouvé sur le net un compte à rebours pour mon site, mais ce n'est pas exactement ce que je recherchais.

Celui-ci insère les nombres de jours, heures, minutes,... dans des champs d'un formulaire. Mais je voudrais juste pouvoir insérer ces nombres dans une phrase et pouvoir changer la police ainsi que la taille et la couleur.

Merci pour les solutions que vous allez sans aucun doute me trouver.

Voici le code que j'ai :

<script language="JavaScript">
// la date à partir de laquelle on compte
var cible = new Date("February 28, 2009 21:00:00");

// nombre de millisecondes par an, jour, heure, minute et seconde
var mms_an = 365 * 24 * 60 * 60 * 1000;
var mms_jour = 24 * 60 * 60 * 1000;
var mms_heure = 60 * 60 * 1000;
var mms_minute = 60 * 1000;
var mms_seconde = 1000;

function decompte() {

// la date courante
var aujourdhui = new Date();

// on crée les variables qui accueilleront les différences entre aujourd'hui et la date à atteindre
var change_a = -1;
var change_j = -1;
var change_h = -1;
var change_m = -1;

// le total de millisecondes de différences
var diff_mms = cible.getTime() - aujourdhui.getTime();

// le nombre d'année(s) entière(s) de différence
diff_annee = Math.floor(diff_mms / mms_an);

// on retire le nombre d'années, fois le nombre de millisecondes par an, de la différence entre aujourd'hui et la date à atteindre
diff_mms -= diff_annee * mms_an;

// pareil pour les jours
diff_jours = Math.floor(diff_mms / mms_jour);
diff_mms -= diff_jours * mms_jour;

// pour les heures
diff_heures = Math.floor(diff_mms / mms_heure);
diff_mms -= diff_heures * mms_heure;

// les... minutes, bravo ;-)
diff_minutes = Math.floor(diff_mms / mms_minute);
diff_mms -= diff_minutes * mms_minute;

// les secondes, ce qui reste en fait.
var diff_secondes = Math.floor(diff_mms / mms_seconde);
diff_mms -= diff_secondes * mms_seconde;

var diff_centi = Math.floor(diff_mms / 10);


// on affecte nos résultats aux champs du formulaire
document.formulaire.jours.value = diff_jours;
document.formulaire.heures.value = diff_heures;
document.formulaire.minutes.value = diff_minutes;
document.formulaire.secondes.value = diff_secondes;
document.formulaire.centi.value = diff_centi;

// on relance la fonction pour actualiser à la seconde
setTimeout("decompte()",10);
}
</script> 

<body onLoad="decompte()">

<form name="formulaire">
<input type="text" name="jours" font="" size="3"> jours
<input type="text" name="heures" size="2"> heures
<input type="text" name="minutes" size="2"> minutes
<input type="text" name="secondes" size="2"> secondes
<input type="text" name="centi" size="3"> centièmes.
</form>

4 réponses

dreamfeeder Messages postés 253 Date d'inscription   Statut Membre Dernière intervention   54
 
tu remplace:

document.formulaire.jours.value = diff_jours;
document.formulaire.heures.value = diff_heures;
document.formulaire.minutes.value = diff_minutes;
document.formulaire.secondes.value = diff_secondes;
document.formulaire.centi.value = diff_centi;

par

phrase= 'il reste '+diff_jours+' jours et '+diff_heures+' heures';

document.getElementById("ici").innerHTML=phrase;


puis dans ton document tu rajoute a l'endroit sohaité
<div id="ici"></div>

apres tu n'a plus qu'a attribuer la couleur et la taille du texte que tu veux a ta div.

cordialement, fabian.
5
Utilisateur anonyme
 
Et une autre question...

Je voudrais que le nombre d'heure soit toujours à 2 chiffres!

exemple : 10h, 09h, 08h, 07h...

Merci
2
dreamfeeder Messages postés 253 Date d'inscription   Statut Membre Dernière intervention   54
 
if(diff_heures<10)
{
diff_heures="0"+diff_heures;
}
2
Utilisateur anonyme
 
Parfait merci...
0