Mettre un code en array pour utilisation multiple [Résolu]

Messages postés
41
Date d'inscription
samedi 4 janvier 2003
Statut
Membre
Dernière intervention
6 avril 2019
- - Dernière réponse : SkyCrasher
Messages postés
41
Date d'inscription
samedi 4 janvier 2003
Statut
Membre
Dernière intervention
6 avril 2019
- 6 avril 2019 à 16:52
Bonjour,
Voici le code auquel je souhaite rajouter une Array pour toujours faire plusieurs occurences sur la même page web:

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script>
countdownManager = {
    // Configuration
    targetTime: new Date('<?PHP echo $dateattaque;?>'), // Date cible du compte à rebours (00:00:00)
    displayElement: { // Elements HTML où sont affichés les informations
        day:  null,
        hour: null,
        min:  null,
        sec:  null
    },
    // Initialisation du compte à rebours (à appeler 1 fois au chargement de la page)
    init: function(){
        // Récupération des références vers les éléments pour l'affichage
        // La référence n'est récupérée qu'une seule fois à l'initialisation pour optimiser les performances
        this.displayElement.day  = jQuery('#countdown_day');
        this.displayElement.hour = jQuery('#countdown_hour');
        this.displayElement.min  = jQuery('#countdown_min');
        this.displayElement.sec  = jQuery('#countdown_sec');
        // Lancement du compte à rebours
        this.tick(); // Premier tick tout de suite
        window.setInterval("countdownManager.tick();", 1000); // Ticks suivant, répété toutes les secondes (1000 ms)
    },
    // Met à jour le compte à rebours (tic d'horloge)
    tick: function(){
        // Instant présent
        var timeNow  = new Date();
        // On s'assure que le temps restant ne soit jamais négatif (ce qui est le cas dans le futur de targetTime)
        if( timeNow > this.targetTime ){
            timeNow = this.targetTime;
        }
        // Calcul du temps restant
        var diff = this.dateDiff(timeNow, this.targetTime);
        this.displayElement.day.text(  diff.day  );
        this.displayElement.hour.text( diff.hour );
        this.displayElement.min.text(  diff.min  );
        this.displayElement.sec.text(  diff.sec  );
    },
    // Calcul la différence entre 2 dates, en jour/heure/minute/seconde
    dateDiff: function(date1, date2){
        var diff = {}                           // Initialisation du retour
        var tmp = date2 - date1;
        tmp = Math.floor(tmp/1000);             // Nombre de secondes entre les 2 dates
        diff.sec = tmp % 60;                    // Extraction du nombre de secondes
        tmp = Math.floor((tmp-diff.sec)/60);    // Nombre de minutes (partie entière)
        diff.min = tmp % 60;                    // Extraction du nombre de minutes
        tmp = Math.floor((tmp-diff.min)/60);    // Nombre d'heures (entières)
        diff.hour = tmp % 24;                   // Extraction du nombre d'heures
        tmp = Math.floor((tmp-diff.hour)/24);   // Nombre de jours restants
        diff.day = tmp;
        return diff;
    }
};
jQuery(function($){
    // Lancement du compte à rebours au chargement de la page
    countdownManager.init();
});
</script>

		<font class="Blanc">
		<span id="countdown_day" ></span> jours
	    <span id="countdown_hour"></span> heures
	    <span id="countdown_min" ></span> minutes
	    <span id="countdown_sec" ></span> secondes
	<?PHP echo "<font id=\"countdown_hour\"></font>";?>
	</font>
		</td></tr>
Afficher la suite 

Votre réponse

6 réponses

Messages postés
1683
Date d'inscription
vendredi 9 mai 2008
Statut
Modérateur
Dernière intervention
16 avril 2019
37
0
Merci
bonjour

tu cherche a afficher plusieurs compteurs ?
Commenter la réponse de @karamel
Messages postés
41
Date d'inscription
samedi 4 janvier 2003
Statut
Membre
Dernière intervention
6 avril 2019
0
Merci
Bonjour,
Exactement un seul script plusieurs compteurs.
Commenter la réponse de SkyCrasher
Messages postés
1683
Date d'inscription
vendredi 9 mai 2008
Statut
Modérateur
Dernière intervention
16 avril 2019
37
0
Merci
malheureusement le script que tu utilise ne peut fonctionné qu'avec un seul compteur je te propose plutot ce script qui permet plusieurs compteurs

<!DOCTYPE html>
<html>
<head>

<style type="text/css">

body{
 background: #333333; 
}

div{
color:white;
margin:auto;
text-align:center;
}

</style>
<script>

function rebour_multiple(tempsFin, idRebour){

 this.tempsFin=tempsFin;
 this.idRebour=document.getElementById(idRebour);
 this.inter=false;
 var that=this;
 this.inter=setInterval(function(){that.rebour()}, 1000);
 this.rebour()
 }

rebour_multiple.prototype.rebour=function(){

 var date1 = new Date().getTime();
 var date2 = new Date(this.tempsFin).getTime();

 if(date1>date2){
  this.idRebour.firstChild.nodeValue ='fini'
  clearInterval(this.inter)
 }

 else{
  var sec = (date2 - date1) / 1000;
  var n = 24 * 3600;

  var j = Math.floor (sec / n);
  var h = Math.floor ((sec - (j * n)) / 3600);
  var mn = Math.floor ((sec - ((j * n + h * 3600))) / 60);
  var sec = Math.floor (sec - ((j * n + h * 3600 + mn * 60)));

  j= j < 10 ? '0' + j : j;
  h= h < 10 ? '0' + h : h;
  mn= mn < 10 ? '0' + mn : mn;
  sec= sec < 10 ? '0' + sec : sec;

  if(j=="00" && h=="00" && mn=="00"){
   this.idRebour.firstChild.nodeValue =sec+"s";
  }
    
  else if(j=="00" && h=="00"){
   this.idRebour.firstChild.nodeValue =mn +"m  "+ sec+"s";
  }

  else if(j=="00"){
   this.idRebour.firstChild.nodeValue =h +"h  "+ mn +"m  "+ sec+"s";
  }
  else{
   this.idRebour.firstChild.nodeValue =j +"J  "+ h +"h  "+ mn +"m  "+ sec+"s";
  }
 }
}

function initcompteur(){

 new rebour_multiple('09/10/2019 22:47:00',"compteur1");

 new rebour_multiple('05/26/2019 12:55:20', "compteur2");

 new rebour_multiple('08/02/2019 18:00:00', "compteur3");
 
 new rebour_multiple('09/10/2019 22:47:00',"compteur4");

 new rebour_multiple('012/18/2019 12:55:20', "compteur5");

 new rebour_multiple('08/02/2019 18:00:00', "compteur6");
 
 new rebour_multiple('09/10/2020 22:47:00',"compteur7");

 new rebour_multiple('02/18/2019 12:55:20', "compteur8");

 new rebour_multiple('04/05/2019 18:00:00', "compteur9");

}

typeof window.addEventListener == 'undefined' ? window.attachEvent('onload', initcompteur) : window.addEventListener('load', initcompteur, false);

</script>

 </head><body>
 
  <div id="compteur1">00:00:00</div>
  <br>
  <div id="compteur2">00:00:00</div>
  <br>
  <div id="compteur3">00:00:00</div>
  <br>
  <div id="compteur4">00:00:00</div>
  <br>
  <div id="compteur5">00:00:00</div>
  <br>
  <div id="compteur6">00:00:00</div>
  <br>
  <div id="compteur7">00:00:00</div>
  <br>
  <div id="compteur8">00:00:00</div>
  <br>
  <div id="compteur9">00:00:00</div>
      
 </body></html>


rien ne sert de courir il faut partir a point.
cours Forest cours !
Commenter la réponse de @karamel
Messages postés
41
Date d'inscription
samedi 4 janvier 2003
Statut
Membre
Dernière intervention
6 avril 2019
0
Merci
Je n'arrive pas à faire fonctionner ton script, il ne manque rien ?
Commenter la réponse de SkyCrasher
Messages postés
1683
Date d'inscription
vendredi 9 mai 2008
Statut
Modérateur
Dernière intervention
16 avril 2019
37
0
Merci
je vient de faire un copier collé au cas ou j'ai fait une erreur et je vient de le testé sur plusieurs navigateur et il marche je ne saurait dire, comment a t'il eté implémenté.

rien ne sert de courir il faut partir a point.
cours Forest cours !
Commenter la réponse de @karamel
Messages postés
41
Date d'inscription
samedi 4 janvier 2003
Statut
Membre
Dernière intervention
6 avril 2019
0
Merci
Il fonctionne mais j'avais un message Access Denied hier.
Merci
Commenter la réponse de SkyCrasher

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.