美文网首页
用H5制作简单倒计时功能

用H5制作简单倒计时功能

作者: 柠檬草的幸运 | 来源:发表于2016-08-15 10:33 被阅读0次

       现在很多网站都会用到倒计时功能,打开京东、淘宝我们会看到好多限时抢购的字眼,今天我跟大家分享一个我写的简单倒计时功能,希望能对大家有所帮助。

        这是效果图:

这是程序的代码:

function timeCounter() {

var currentDate = new Date();

var targetDate = new Date(2017, 0, 31);

var seconds = (targetDate.getTime() - currentDate.getTime()) / 1000;

seconds = parseInt(seconds); //秒数取整

var day = parseInt(seconds / 86400);

seconds %= 86400;

var hour = parseInt(seconds / 3600);

seconds %= 3600;

var minute = parseInt(seconds / 60);

var second = seconds %= 60;

var display = document.getElementById('display');

display.innerHTML = "距离"+targetDate.getFullYear()+

"年还有"+day+"天"+hour+"小时"+minute+"分钟"+second+"秒";

}

setInterval('timeCounter()',1000);

相关文章

网友评论

      本文标题:用H5制作简单倒计时功能

      本文链接:https://www.haomeiwen.com/subject/kniijttx.html