Plusieurs Compte à rebours JS sur même page ?
Résolu
shoub-tcy
Messages postés
173
Statut
Membre
-
muriel -
muriel -
Bonjour,
J'ai mis plusieurs comptes à rebours classiques (j : h : min : s) sur la même page mais le problème est qu'il n'y en a qu'un seul qui fonctionne sur tous, les autres affichent bien le temps restant, mais le temps restent figés. Voici le code de l'un des compte à rebours:
<script type="text/JavaScript">
var Affiche=document.getElementById("Compte");
function Rebour() {
var date1 = new Date();
var date2 = new Date ("May 25 13:40:00 2012"); // 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)));
if(j == 0){
j = '';
Jour = '';
} else {
Jour = (j == 1) ? "j <span class='or'>|</span>" : "j <span class='or'>|</span>";
}
if(h == 0){
h = '';
Heure = '';
} else {
Heure = (h == 1) ? "h <span class='or'>|</span>" : "h <span class='or'>|</span>";
}
if(mn == 0){
mn = '';
Minute = '';
} else {
Minute = (mn == 1) ? "min <span class='or'>|</span>" : "min <span class='or'>|</span>";
}
if(sec == 0){
sec = '';
Seconde = '';
Et = '';
} else {
Seconde = (sec == 1) ? "sec" : "sec";
Et = (mn == 0 && h == 0 && j == 0) ? "" : "";
}
Affiche.innerHTML = j + ' ' + Jour + ' ' + h + ' ' + Heure + ' ' + mn + ' ' + Minute + ' ' + Et + ' ' + sec + ' ' + Seconde;
}
else {
}
tRebour=setTimeout ("Rebour();", 1000);
}
Rebour();
</script>
Si vous avez des idées pour pouvoir faire fonctionner plusieurs compte à rebours de ce type sur la même page ou une autre solution, n'hésitez pas à me le fair savoir :)
Cordialement
J'ai mis plusieurs comptes à rebours classiques (j : h : min : s) sur la même page mais le problème est qu'il n'y en a qu'un seul qui fonctionne sur tous, les autres affichent bien le temps restant, mais le temps restent figés. Voici le code de l'un des compte à rebours:
<script type="text/JavaScript">
var Affiche=document.getElementById("Compte");
function Rebour() {
var date1 = new Date();
var date2 = new Date ("May 25 13:40:00 2012"); // 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)));
if(j == 0){
j = '';
Jour = '';
} else {
Jour = (j == 1) ? "j <span class='or'>|</span>" : "j <span class='or'>|</span>";
}
if(h == 0){
h = '';
Heure = '';
} else {
Heure = (h == 1) ? "h <span class='or'>|</span>" : "h <span class='or'>|</span>";
}
if(mn == 0){
mn = '';
Minute = '';
} else {
Minute = (mn == 1) ? "min <span class='or'>|</span>" : "min <span class='or'>|</span>";
}
if(sec == 0){
sec = '';
Seconde = '';
Et = '';
} else {
Seconde = (sec == 1) ? "sec" : "sec";
Et = (mn == 0 && h == 0 && j == 0) ? "" : "";
}
Affiche.innerHTML = j + ' ' + Jour + ' ' + h + ' ' + Heure + ' ' + mn + ' ' + Minute + ' ' + Et + ' ' + sec + ' ' + Seconde;
}
else {
}
tRebour=setTimeout ("Rebour();", 1000);
}
Rebour();
</script>
Si vous avez des idées pour pouvoir faire fonctionner plusieurs compte à rebours de ce type sur la même page ou une autre solution, n'hésitez pas à me le fair savoir :)
Cordialement
A voir également:
- Compte à rebours html javascript
- Créer un compte google - Guide
- Installer windows 10 sans compte microsoft - Guide
- Editeur html - Télécharger - HTML
- Créer un compte gmail - Guide
- Comment savoir qui regarde mon compte facebook - Guide
3 réponses
Bon ben voilà je t'ai modifié ton script, chez moi ça fonctionne sous FireFox
<html>
<script type="text/JavaScript">
function Rebour(date_event,id_compte_rebours) {
var Affiche=document.getElementById(id_compte_rebours);
var date1 = new Date();
var date2 = new Date (date_event); // 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)));
if(j == 0){
j = '';
Jour = '';
} else {
Jour = (j == 1) ? "j <span class='or'>|</span>" : "j <span class='or'>|</span>";
}
if(h == 0){
h = '';
Heure = '';
} else {
Heure = (h == 1) ? "h <span class='or'>|</span>" : "h <span class='or'>|</span>";
}
if(mn == 0){
mn = '';
Minute = '';
} else {
Minute = (mn == 1) ? "min <span class='or'>|</span>" : "min <span class='or'>|</span>";
}
if(sec == 0){
sec = '';
Seconde = '';
Et = '';
} else {
Seconde = (sec == 1) ? "sec" : "sec";
Et = (mn == 0 && h == 0 && j == 0) ? "" : "";
}
Affiche.innerHTML = j + ' ' + Jour + ' ' + h + ' ' + Heure + ' ' + mn + ' ' + Minute + ' ' + Et + ' ' + sec + ' ' + Seconde;
}else{
Affiche.innerHTML="<font color=\"red\">C'est fini !!</font>";
}
}
</script>
Compte à rebours 1:<div id="compte_rebours_1"></div><br /><br />
Compte à rebours 2:<div id="compte_rebours_2"></div><br /><br />
Compte à rebours 3:<div id="compte_rebours_3"></div><br /><br />
Compte à rebours 4:<div id="compte_rebours_4"></div><br /><br />
Compte à rebours 5:<div id="compte_rebours_5"></div><br /><br />
<script type="text/JavaScript">
//il vaut mieux mettre cette partie après les div à cause des id
setInterval(function(){Rebour('May 25 13:40:00 2012','compte_rebours_1');}, 1000);
setInterval(function(){Rebour('June 15 15:35:05 2012','compte_rebours_2');}, 1000);
setInterval(function(){Rebour('June 28 10:30:18 2012','compte_rebours_3');}, 1000);
setInterval(function(){Rebour('June 30 8:10:30 2012','compte_rebours_4');}, 1000);
setInterval(function(){Rebour('May 15 8:20:50 2012','compte_rebours_5');}, 1000);
</script>
</html>
muriel
Comment je fais pour régler la date de référence? je voudrais que la référence qoit le calendrier standard du jour ou on consulte le site...Merci beaucoup pour votre réponse.
