Compte à rebours pour événements à répétition

Soyez le premier à donner votre avis sur cette source.

Snippet vu 10 783 fois - Téléchargée 19 fois

Commenter

Contenu du snippet

Bonjour,

Voici un code permettant d'afficher sur sa page Web un compte à rebours pour des événements répétitifs.

Merci de me faire parvenir vos commentaires.

Utilisation : insérer la balise Div à l'endroit où l'on veut que le compte à rebours s'affiche. Les différentes variables de la fonction Rebour() sont expliquées dans le commentaire.

Source / Exemple : 


<html><body>
<label id="Compte"></label>
<script language="javascript">
function Rebour(LabelId, d_start, n_episodes, ecart, Text) {
	/* LabelId = nom du label dans lequel placer le texte


    	
    • 	
    •  n_episodes = nbre d'épisodes dans la saison

      • 	
    •  d_start = date de début

      • 	
    •  ecart = écart entre 2 épisodes en jour

      • 	
    •  Text = text à afficher avant le compte à rebours

    • 	
  • /


	var affiche = document.getElementById(LabelId);
	var date_start = new Date(d_start);
	date_start = date_start.getTime(); // transforme la date de début en timestamp (milli-secondes)
	ecart_cor = ecart * 24 * 3600 * 1000; // Mettre valeur en mili-secondes
	var saison = new Array(); // tableau des dates des épisodes
	saison[0] = date_start;

	var auj = new Date(); // heure actuelle
	auj = auj.getTime(); // transforme la date de début en timestamp (milli-secondes)

	for (i = 1; i < n_episodes; i++) { // Boucle de remplissage des dates des épisodes (le premier est déjà inséré)
		saison[i] = saison[i - 1] + ecart_cor;
	}

	for (i = 0; i < n_episodes; i++) { // Boucle permettant de trouvé l'épisode suivant
		if (saison[i] > auj) {
			var duree = (saison[i] - auj) / 1000; // Obtient le temps restant jusqu'au prochain épisode
			var jours = Math.floor(duree / (24 * 3600));
			var heures = Math.floor((duree - jours * 24 * 3600) / 3600);
			var minutes = Math.floor((duree - jours * 24 * 3600 - heures * 3600) / 60);
			break; // Arrête la boucle
		}
	}
	affiche.innerHTML = unescape(Text) + jours +" jours "+ heures +" h "+ minutes +" min";
	tRebour = setTimeout('Rebour("' + LabelId + '", "' + d_start + '", ' + n_episodes + ', ' + ecart + ', "' + Text + '");', 1000);
}
Rebour("Compte", "May 05 00:27:00 2010", 24, 14, "Début dans : ");
</script>
</body></html>

Conclusion :


La variable Text peut être supprimer pour insérer du texte directement avant le label

A voir également

Ajouter un commentaire Commentaires
jdmcreator Messages postés 647 Date d'inscription samedi 30 décembre 2000 Statut Membre Dernière intervention 20 juillet 2012 7
13 mai 2010 à 22:51
'Un petit conseil, <script language="javascript"> est déprécié, utiliser <script type="text/javascript"> '

text/javascript est déjà déprécié, il faut plutôt utiliser application/javascript (quoi que ce ne soit pas très répandu) ;)

Pour le script : Peut-être retourné une variable contenant le temps restant plutôt que de l'afficher en dure ;)
CSIBern Messages postés 44 Date d'inscription dimanche 3 décembre 2000 Statut Membre Dernière intervention 21 mai 2014
10 mai 2010 à 12:31
Merci pour ce commentaire, je tâcherai d'en tenir compte pour les prochaines fois.
cynicfocus Messages postés 8 Date d'inscription mardi 14 novembre 2006 Statut Membre Dernière intervention 10 mai 2010
10 mai 2010 à 11:58
Un petit conseil, <script language="javascript"> est déprécié, utiliser <script type="text/javascript">
Merci pour le script de compte à rebours :)
S'inscrire maintenant

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.

Du même auteur (CSIBern)