统计
  • 建站日期:2021-03-10
  • 文章总数:1015 篇
  • 评论总数:1869 条
  • 分类总数:14 个
  • 最后更新:12月12日
文章 未分类

又快过年了,分享一款新年倒计时代码给大家

安小熙
首页 未分类 正文
广告

2024年很快就要到了
一年真的眨眼及就过去了!

<!DOCTYPE html>
<html>
<head>
    <title>新年倒计时</title>
    <script>
        function countdown() {
            var now = new Date();
            var eventDate = new Date("January 1, 2022 00:00:00"); // 新年时间
            var currentTime = now.getTime();
            var eventTime = eventDate.getTime();
            var remTime = eventTime - currentTime;
            var sec = Math.floor(remTime / 1000);
            var min = Math.floor(sec / 60);
            var hr = Math.floor(min / 60);
            var day = Math.floor(hr / 24);
            hr %= 24;
            min %= 60;
            sec %= 60;
            hr = (hr < 10) ? "0" + hr : hr;
            min = (min < 10) ? "0" + min : min;
            sec = (sec < 10) ? "0" + sec : sec;
            document.getElementById("days").innerHTML = day;
            document.getElementById("hours").innerHTML = hr;
            document.getElementById("minutes").innerHTML = min;
            document.getElementById("seconds").innerHTML = sec;
            setTimeout(countdown, 1000);
        }
    </script>
    <style>
        body {
            font-family: Arial, sans-serif;
            text-align: center;
        }
        h1 {
            font-size: 3em;
            margin-top: 50px;
        }
        .countdown {
            display: flex;
            justify-content: center;
            align-items: center;
            margin-top: 50px;
        }
        .countdown div {
            border-radius: 5px;
            background-color: #333;
            color: #fff;
            font-size: 2em;
            padding: 20px;
            margin: 0 10px;
        }
    </style>
</head>
<body onload="countdown()">
    <h1>新年倒计时</h1>
    <div class="countdown">
        <div>
            <span id="days"></span>
            <div>天</div>
        </div>
        <div>
            <span id="hours"></span>
            <div>小时</div>
        </div>
        <div>
            <span id="minutes"></span>
            <div>分钟</div>
        </div>
        <div>
            <span id="seconds"></span>
            <div>秒</div>
        </div>
    </div>
</body>
</html>

源码截图


又快过年了,分享一款新年倒计时代码给大家
-安小熙博客
-第1
张图片

版权说明
本站提供的一切软件、教程和内容信息仅限用于学习和研究目的;不得将上述内容用于商业或者非法用途,否则,一切后果请用户自负。本站信息来自网络收集整理,如果您喜欢该程序和内容,请支持正版,购买注册,得到更好的正版服务。我们非常重视版权问题,如有侵权请邮件:axxgzs@qq.com与我们联系处理。敬请谅解!!

这篇文章最后更新于2023-6-30,已超过 1 年没有更新,如果文章内容或图片资源失效,请留言反馈,我们会及时处理,谢谢!
2023最新修复版孤傲授权系统网站授权源码去后门php源码
« 上一篇
彩虹云商城模板素颜4首发免费分享
下一篇 »
为了防止灌水评论,登录后即可评论!

HI ! 请登录
注册会员,享受下载全站资源特权。

🔎百度一下

帮忙seo优化一下吧

☁天气预报

标签

最新文章