Discussion :

[Toulousaing]

Bonjour à tous,

Qui m'aiderait à modifier ce script (trouvé ici) pour avoir mon compteur à rebours non pas avec une échéance hhmmss, mais une date dans le futur, donc jjmmaahhmmss, svp ?

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
<!-- DEBUT DU SCRIPT COMPTE A REBOURS -->
 
<script language="JavaScript1.2">
 
 
function setcountdown(thehour,themin,thesec){
hr=thehour;min=themin;sec=thesec
}
 
////////// CONFIGUREZ LE COMPTEUR CI-DESSOUS //////////////////
 
// 1°) Configurez la date dans le futur dans le format HEURES sur 24h (0=minuit,23=11pm), MINUTES, SECONDES
setcountdown(10,5,00)
 
// 2°) Changez les deux textes ci-dessous. Le premier pour annoncer l'évènement, le second qui s'affichera à la fin du compte à rebours.
var occasion=" le premier tour"
var message_on_occasion="C'est aujourd'hui !"
 
// 3°) Configurez ci-dessous 5 variables pour la largeur, hauteur, la couleur de l'arrière plan, et le style du texte du champ
var countdownwidth='640px' // ou une valeur en % comme var countdownwidth='95%'
var countdownheight='35px'
var countdownbgcolor='#FFEBCD' // ou une couleur en texte comme : lightyellow
var opentags='<font face="Verdana"><small>'
var closetags='</small></font>'
 
////////// NE RIEN EDITER CI-DESSOUS //////////////////
 
var montharray=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec")
var crosscount=''
 
function start_countdown(){
if (document.layers)
document.countdownnsmain.visibility="show"
else if (document.all||document.getElementById)
crosscount=document.getElementById&&!document.all?document.getElementById("countdownie") : countdownie
countdown()
}
 
if (document.all||document.getElementById)
document.write('<span id="countdownie" style="width:'+countdownwidth+'; background-color:'+countdownbgcolor+'"></span>')
 
window.onload=start_countdown
 
 
function countdown(){
  var today=new Date()
  var todayy=today.getYear()
  if (todayy < 1000)
  todayy+=1900
  var todaym=today.getMonth()
  var todayd=today.getDate()
  var todayh=today.getHours()
  var todaymin=today.getMinutes()
  var todaysec=today.getSeconds()
  var todaystring=montharray[todaym]+" "+todayd+", "+todayy+" "+todayh+":"+todaymin+":"+todaysec
  futurestring=montharray[todaym]+" "+todayd+", "+todayy+" "+hr+":"+min+":"+sec
  dd=Date.parse(futurestring)-Date.parse(todaystring)
  dhour=Math.floor((dd%(60*60*1000*24))/(60*60*1000)*1)
  dmin=Math.floor(((dd%(60*60*1000*24))%(60*60*1000))/(60*1000)*1)
  dsec=Math.floor((((dd%(60*60*1000*24))%(60*60*1000))%(60*1000))/1000*1)
  //if on day of occasion
  if(dhour<=0&&dmin<=0&&dsec<=1&&todayd==da){
  if (document.layers){
  document.countdownnsmain.document.countdownnssub.document.write(opentags+message_on_occasion+closetags)
  document.countdownnsmain.document.countdownnssub.document.close()
  }
  else if (document.all||document.getElementById)
  crosscount.innerHTML=opentags+message_on_occasion+closetags
  return
  }
  //else, if not yet
  else{
  if (document.layers){
  document.countdownnsmain.document.countdownnssub.document.write("Il reste "+opentags+dhour+" heures, "+dmin+" minutes, et "+dsec+" secondes avant "+occasion+closetags)
  document.countdownnsmain.document.countdownnssub.document.close()
  }
  else if (document.all||document.getElementById)
  crosscount.innerHTML="Il reste "+opentags+dhour+" heures, "+dmin+" minutes, et "+dsec+" secondes avant "+occasion+closetags
  }
  setTimeout("countdown()",1000)
}
</script><!-- FIN DU SCRIPT COMPTE A REBOURS -->

Merci beaucoup.
A++

[danielhagnoul]

Je ne sais pas si cela répondra à votre besoin, mais je viens de poster un billet dans mon blog : Compte à rebours (countdown)

[Toulousaing]

Merci beaucoup, le code fonctionne parfaitement, mais je n'ai pas trouvé où entrer la date de début du compte à rebours. Par exemple 23 avril 2017 09:00.

[danielhagnoul]

J'ai fait des ajouts à mon billet de blog.

La fonction countdownFromDate( id = "#countdown", interval = 1, date = moment().add( 20, "seconds" ) ) compte à rebours à partir d'une date future.

Et j'ai ajouté un exemple : compte à rebours à partir du 4 avril 2017 à 0 heures, 15 minutes et 30 secondes (2017-04-04 00:15:30).

[Toulousaing]

Merci.
J'ai recopié l'intégralité du code exemple, mais je n'ai plus d'affichage... :-(

[danielhagnoul]

Je teste toujours mes codes avant de les donner, je peux vous assurer qu'ils fonctionnent si votre navigateur n'est pas obsolète.

Dans votre code j'ai trouvé :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
// ci-dessous, compte à rebours à partir d'une date future
countdownFromDate( "#countdown", 1, "2017-03-23 09:00:00" );

Je n'ai pas trouvé : <output id="countdown"></output>.

Si vous devez être compatible avec les navigateurs IE8+, il faut convertir le code ES2015 en ES5 avec Babel.

Voir : https://babeljs.io/repl/#?babili=fal...20%20%20%7D%3B

[Toulousaing]

ligne 207
je suis bien sûr que tu as testé, rassure-toi, je ne fais que dire que je ne comprends pas pourquoi le code précédent fonctionnait et pas celui-ci.
je reprendrai les deux sources ligne par ligne demain.
merci.

[danielhagnoul]

C'est pourtant clair, le 23 mars 2017 est une date ancienne pas une date future !

[Toulousaing]

C'était cela, erreur de date de début.
Merci beaucoup. Ca marche !