JavaScript - 倒计时实例(元旦、国庆、中秋倒计时)

倒计时

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>元旦倒计时</title>
    <style type="text/css">
        #msg{
            text-align: center;
            font-size: 130px;
        }

        #timer{
            font-size: 130px;
            color: red;
        }
    </style>
    <script type="text/javascript">

        function showTime(){
            var currentTime=new Date();
            var endTime=new Date("2015/2/13");
            var remainTime=endTime.getTime()-currentTime.getTime();
            // 1天=24小时  1小时=60分钟  1分钟=60秒  1秒=1000毫秒
            var day=Math.floor(remainTime/(24*60*60*1000));
            var hour=Math.floor((remainTime-day*24*60*60*1000)/(60*60*1000));
            var minute=Math.floor((remainTime-day*24*60*60*1000-hour*60*60*1000)/(60*1000));
            var second=Math.floor((remainTime-day*24*60*60*1000-hour*60*60*1000-minute*60*1000)/(1000));
            if(remainTime<0){
                document.getElementById("msg").innerHTML="元旦已经结束!";
            }else{
            var time=day+"天 "+hour+"时"+minute+"分"+second+"秒!";
            document.getElementById("timer").innerHTML=time;
            }

        }
        setInterval("showTime()",1000);
    </script>
</head>
<body>
    <div id="msg">距离网博放假还有:<br/><span id="timer"></span><br/>一定要Holder住!!!!</div>
</body>
</html>
时间: 2024-10-11 18:51:16

JavaScript - 倒计时实例(元旦、国庆、中秋倒计时)的相关文章

可以防止刷新重置的倒计时实例代码

可以防止刷新重置的倒计时实例代码:一般说来,除了我们明确设置一个到期时间日期,比如类似于2018-5-12这样,一般在刷新网页的时候都会使倒计时重新来过,下面就介绍一下可以防止这种情况的方式,希望能够给需要的朋友带来一定的帮助.实例代码如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content=&quo

jQuery实现的美观的倒计时实例代码

jQuery实现的美观的倒计时实例代码:倒计时效果有着广泛的应用,比如奥运会倒计时.高考倒计时和放假倒计时等,本章节分享一个比较美观且实用的倒计时效果.代码实例如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/" />

编写自己的代码库(javascript常用实例的实现与封装)

编写自己的代码库(javascript常用实例的实现与封装) 1.前言 大家在开发的时候应该知道,有很多常见的实例操作.比如数组去重,关键词高亮,打乱数组等.这些操作,代码一般不会很多,实现的逻辑也不会很难,下面的代码,我解释就不解释太多了,打上注释,相信大家就会懂了.但是,用的地方会比较,如果项目有哪个地方需要用,如果重复写的话,就是代码沉余,开发效率也不用,复用基本就是复制粘贴!这样是一个很不好的习惯,大家可以考虑一下把一些常见的操作封装成函数,调用的时候,直接调用就好!源码都放在githu

Win10系列:JavaScript综合实例1

上面几个小节讲解了使用HTML5和JavaScript语言开发Windows 应用商店应用时会用到的一些技术,本小节将前面介绍的知识融合在一起创建一个菜谱应用程序,帮助读者更进一步地理解和掌握这些知识. 此菜谱应用程序主要的功能是介绍一些菜肴和主食的做法,其中包含三个页面:第一个页面为主页面,用于按类别显示一些菜肴和主食:第二个页面为分类页面,显示某个类别的信息和属于该类别的菜肴或主食:第三个页面为菜肴页面,显示某项菜肴或主食的详细信息,如名称.图片和具体做法.这三个页面可以相互跳转,例如,在主

10种JavaScript特效实例让你的网站更吸引人

我们有三种主要的方法(从难到易):自己动手写脚本;使用类似于jQuery和mooTools的JavaScript框架(可以让编写代码变得更容易些);使用能工作于现有的JavaScript框架下的提前预置好的脚本或那种从头开始开发的创建者.这篇文章适合那些打算提高工作效率或不愿意从头开发脚本的人阅读. 您还可以参考以下JavaScript/Ajax相关教程及资源:<10个非常棒的Ajax及Javascript实例资源网站><12种Javascript解决常见浏览器兼容问题的方法>&l

JavaScript动画实例:李萨如曲线

在“JavaScript图形实例:阿基米德螺线”和“JavaScript图形实例:曲线方程”中,我们学习了利用曲线的方程绘制曲线的方法.如果想看看曲线是怎样绘制出来的,怎么办呢?编写简单的动画,就可以展示指定曲线的绘制过程. 1.李萨如曲线 设定李萨如曲线的坐标方程为: X=SIN(2θ) Y=SIN(3θ)     (0≤θ≤2π) 将0~2π区间等分512段,取θ的初始值π/256,按曲线方程求得坐标值(x,y),并在当前坐标处通过绘制一个实心圆的方式描点.之后每隔0.02秒,将θ的初始值加

javascript 体验倒计时:距离国庆还有多长时间

1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <style> 7 div { 8 width: 1210px; 9 margin: 200px auto; 10 color: orange; 11 text-align: center

[javascript]各种页面定时跳转(倒计时跳转)代码总结

(1)使用setTimeout函数实现定时跳转(如下代码要写在body区域内) 1 <script type="text/javascript"> 2 //3秒钟之后跳转到指定的页面 3 setTimeout(window.location.href='http://www.baidu.com',3); 4 </script> (2)html代码实现,在页面的head区域块内加上如下代码 1 <!--5秒钟后跳转到指定的页面--> 2 <met

jQuery倒计时实例

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Typ