3 réponses
prosthetiks
Messages postés
1189
Date d'inscription
dimanche 7 octobre 2007
Statut
Membre
Dernière intervention
12 juin 2020
431
10 mars 2014 à 21:53
10 mars 2014 à 21:53
Z'vais te faire un truc ! :)
prosthetiks
Messages postés
1189
Date d'inscription
dimanche 7 octobre 2007
Statut
Membre
Dernière intervention
12 juin 2020
431
10 mars 2014 à 23:21
10 mars 2014 à 23:21
Voila une base de travail:
<html>
<head>
<meta charset="utf-8" />
<title></title>
<style type="text/css">
.decompte div{
float: left;
padding: 10px;
position: relative;
width: 30px;
text-align: center;
}
#name{
width: 150px;
padding-right: 30px;
text-align: right;
display: block;
float: left;
font-weight: bolder;
}
.decompte #hours:after{
content: "H";
position: absolute;
top: -7px;
text-align: center;
left: 0;
width: 100%;
}
.decompte #minutes:after{
content: "M";
position: absolute;
top: -7px;
text-align: center;
left: 0;
width: 100%;
}
.decompte #seconds:after{
content: "S";
position: absolute;
top: -7px;
text-align: center;
left: 0;
width: 100%;
}
.decompte #milliseconds:after{
content: "MS";
position: absolute;
top: -7px;
text-align: center;
left: 0;
width: 100%;
}
</style>
</head>
<body>
<div class="decompte">
<span id="name"></span>
<div id="hours"></div>
<div id="minutes"></div>
<div id="seconds"></div>
<div id="milliseconds"></div>
</div>
<script type="text/javascript" src="https://momentjs.com/downloads/moment.min.js"></script>
<script type="text/javascript">
var countdown = {
interval: 10,
timer:null,
currentTime: null,
vacances: [
{
name: 'Vacances d\'été',
start: moment('2014-07-15 00:00:00').unix()
},
{
name: 'Printemps',
start: moment('2014-09-15 00:00:00').unix()
},
{
name: 'Automne',
start: moment('2014-05-15 00:00:00').unix()
},
{
name: 'Hiver',
start: moment('2014-08-19 00:00:00').unix()
}
],
setCurrentTime: function(){
this.currentTime = new Date().getTime();
},
init: function(){
this.timer = setInterval(this.update, this.interval, this);
},
update: function(me){
me.setCurrentTime();
var goal = me.vacances[0].start*1000;
var hours = parseInt((goal - me.currentTime) / 3600000);
var duration = moment.duration( goal - me.currentTime , "milliseconds");
document.getElementById('hours').innerHTML = hours;
document.getElementById('minutes').innerHTML = duration.minutes();
document.getElementById('seconds').innerHTML = duration.seconds();
document.getElementById('milliseconds').innerHTML = duration.milliseconds();
document.getElementById('name').innerHTML = me.vacances[0].name;
}
}
countdown.init();
</script>
</body>
</html>
