首页跨年倒计时html代码

跨年倒计时html代码

时间: 2023-11-29 14:45:20 浏览: 130

以下是一个简单的跨年倒计时HTML代码示例： ```html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>跨年倒计时</title> </head> <body> <h1>距离新年还有：</h1> <div id="countdown"></div> <script> // 设置倒计时结束时间 var countDownDate = new Date("Jan 1, 2022 00:00:00").getTime(); // 每秒更新倒计时 var x = setInterval(function() { // 获取当前时间 var now = new Date().getTime(); // 计算距离结束时间还有多久 var distance = countDownDate - now; // 计算剩余时间的天、小时、分钟和秒数 var days = Math.floor(distance / (1000 * 60 * 60 * 24)); var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60)); var seconds = Math.floor((distance % (1000 * 60)) / 1000); // 将剩余时间显示在页面上 document.getElementById("countdown").innerHTML = days + " 天 " + hours + " 小时 " + minutes + " 分钟 " + seconds + " 秒 "; // 如果倒计时结束，显示提示信息 if (distance < 0) { clearInterval(x); document.getElementById("countdown").innerHTML = "跨年啦！"; } }, 1000); </script> </body> </html> ```

阅读全文