您的位置:首页 > Web前端 > JavaScript

js实现倒计时效果

2017-07-07 17:24 253 查看
<div class="count-down cur-time run-apply"
style="background-image:url(./run-apply.png)">
<div class="down-number">
<div class="down">
<span class="days" id="days">0</span>
<i class="line"></i>
<p class="time-en">Days</p>
</div>
<div class="down">
<span class="hours" id="hours">0</span>
<i class="line"></i>
<p class="time-en">Hours</p>
</div>
<div class="down">
<div id="minute" class="hours">0</div>
<i class="line"></i>
<p class="time-en">Minute</p>
</div>
</div>
</div>


<script language="javascript" type="text/javascript">
var interval = 1000;
//function ShowCountDown(year,month,day,theHour,theMinute)
function ShowCountDown() {
var now = new Date();
//new Date(yyyy,mth,dd,hh,mm,ss);月份(0-11,0代表1月)
var endDate = new Date(2017, 7 - 1, 29, 16, 25);
var leftTime = endDate.getTime() - now.getTime();
var leftsecond = parseInt(leftTime / 1000);
var day1 = Math.floor(leftsecond / (60 * 60 * 24));
var hour = Math.floor((leftsecond - day1 * 24 * 60 * 60) / 3600);
var minute = Math.floor((leftsecond - day1 * 24 * 60 * 60 - hour * 3600) / 60) + 1;
var second = Math.floor(leftsecond - day1 * 24 * 60 * 60 - hour * 3600 - minute * 60);
var dd = document.getElementById("days");
var hh = document.getElementById("hours");
var mm = document.getElementById("minute");

//var ss =document.getElementById("sec");
if (leftTime <= '0') {
dd.innerHTML = "0";
hh.innerHTML = "0";
mm.innerHTML = "0";
//ss.innerHTML ="0";
} else {
dd.innerHTML = day1;
if (hour < 10) {
hh.innerHTML = "0" + hour;
} else {
hh.innerHTML = hour;
}
if (minute < 10) {
mm.innerHTML = "0" + minute;
} else {
mm.innerHTML = minute;
}
}
}

$(function () {
ShowCountDown();
window.setInterval(function () {
ShowCountDown();
}, interval);

});
</script>




完整代码下载

http://pan.baidu.com/s/1bpldpgz
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: