网站购物做限时抢购、秒杀的JS倒计时代码,之前做的活动页面很多都用到了倒计时功能,所以整理下分享给大家。css根据不同做出你自已想要的美化效果,这里主要写出没有BUG的JS代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
*{
padding: 0;
margin: 0;
}
span{
width: 36px;
height: 36px;
background: darkcyan;
color: white;
}
</style>
<script type="text/javascript">
window.onload = function(){
var t;
function hs(){
var new_time = new Date();
var wl_time = new Date(2018,8,10,0,30,0);
var xsj = wl_time.getTime() - new_time.getTime();
if (xsj<0) {
xsj=0;
}
if (xsj==0) {
clearInterval(t);
// tian = '00';
// xiaosi = '00';
// fen = '00';
// miao = '00';
}
var tian = parseInt(xsj/(24*60*60*1000));
if (tian<10) {
tian = "0"+tian;
}
xsj = xsj%(24*60*60*1000);
var xiaosi = parseInt(xsj/(60*60*1000));
if (xiaosi<10) {
xiaosi = '0'+xiaosi;
}
xsj = xsj%(60*60*1000);
var fen = parseInt(xsj/(60*1000));
if (fen<10) {
fen = '0'+fen;
}
xsj = xsj%(60*1000);
var miao = parseInt(xsj/1000);
if (miao<10) {
miao = '0'+miao;
}
// var time = document.getElementById('time');
var kk = document.getElementById('time').getElementsByTagName('span');
kk[0].innerHTML = tian;
kk[1].innerHTML = xiaosi;
kk[2].innerHTML = fen;
kk[3].innerHTML = miao;
}
hs();
t = setInterval(hs,1000);
}
</script>
</head>
<body>
<div id="time">距离百家惠全场打折活动还剩<span>0</span>天<span>0</span>小时<span>0</span>分钟<span>0</span>秒</div>
</body>
</html>
原文链接:https://www.qiquanji.com/post/7371.html
本站声明:网站内容来源于网络,如有侵权,请联系我们,我们将及时处理。
微信扫码关注
更新实时通知
