<!DOCTYPE html>
<html>

<head>
<meta charset="UTF-8">
<title>js倒计时显示-细数逝去的过往</title>
<style type="text/css">
#clock {
font: bold 24pt sans;
background-color: #f5f5f5;
padding: 10px 15px;
border: 1px solid #ccc;
border-radius: 5px;
}

.demo {
position: absolute;
margin-left: 40%;
margin-top: 40%;
}
</style>
</head>

<body>
<div class="demo">
<center>
<h1>下班倒计时显示</h1>
</center>
<span id="clock"></span>
</div>
<script>
function displayTime() {
var elt = document.getElementById("clock");
if(leftTime < 0) {
elt.innerHTML = "Over";
} else {
var endTime = new Date("2016/11/21 18:00:00");
var now = new Date();
var leftTime = endTime.getTime() - now.getTime();
var ms = parseInt(leftTime % 1000).toString();
leftTime = parseInt(leftTime / 1000);
var o = Math.floor(leftTime / 3600);
var d = Math.floor(o / 24);
var m = Math.floor(leftTime / 60 % 60);
var s = leftTime % 60;
elt.innerHTML = o + "小时:" + m + "分:" + s + "秒:" + ms.charAt(0);
setTimeout(displayTime, 100);
}
}
displayTime();
</script>

</body>

</html>

js倒计时显示的更多相关文章

  1. js倒计时 手机休眠时 时间不进行减少

    http://www.111cn.net/wy/js-ajax/94218.htm 手机版网页js倒计时存在的问题与解决的方法 www.111cn.net 更新:2015-09-16 编辑:kp123 ...

  2. js倒计时-倒计输入的时间

    计算指定时间到指定时间之间相差多少天.时.分.秒. 节日.活动.商城常用. 原理: 主要使用到时间戳,也就是从1970 年 1 月 1 日 到指定时间的毫秒数. 1. 求出毫秒差 :当两个时间直接进行 ...

  3. js 倒计时（可自定义时间）

    <html> <head> <title>js 倒计时</title> </head> <body> <div> & ...

  4. Js控制显示、隐藏文本框中的密码

    Js控制显示.隐藏文本框中的密码,也可称为是一款小型的JavaScript星号密码破解器,点击会显示出密码类型的文本框中的真实信息,再次点击则还原,程序 主要是获取HTML元素对象,然后强制更改元素属 ...

  5. Js倒计时程序

    Js倒计时程序 点击下载

  6. js简单显示和隐藏div，触发超链接，动态更改button值，setInterval（）简单使用，jquery easyui弹出框简单使用 .

    js简单显示和隐藏div .<!DOCTYPE html> .<html> .<head> .<meta charset="UTF-8"& ...

  7. JS倒计时网页自动跳转代码

    <title>JS倒计时网页自动跳转代码</title> <script language="JavaScript" type="text/ ...

  8. JS倒计时 代码

    JS倒计时 代码 <div> <span id="KSD">3</span>天 <span id="KSH">1 ...

  9. JS 实现显示和隐藏div（以百度地图为例）

    主要参考的文章:https://my.oschina.net/xsh1208/blog/215811,https://zhidao.baidu.com/question/568774688.html ...

随机推荐

  1. 《C++ Primer》学习笔记【第二部分 C++标准库】

    第8章 IO库 IO对象不能复制,即1.IO对象不能存储在vector或其他容器中   2.如果需要传递或返回IO对象,必须传递或返回指向该对象的指针或引用. 一般情况下,如果要传递IO对象以便对它进 ...

  2. 编写我的第一个CGI代码——python学习

    在编程学习网站学习Python语言,学习到cgi编程章节遇到了一些小问题,课程介绍的为linux环境的Apache配置方法,具体如下: [linux环境配置方法:] 在进行CGI编程前,确保您的Web ...

  3. zookeeper、kafka、storm install

    安装顺序 zookeeper,kafka,storm install zookeeper 1.上传tar包,解压tar tar -zxvf   zookeeper-3.4.6.tar.gz 2.复制 ...

  4. Name jdbc is not bound in this Context

    简介 今天接手中行一个交通罚款web工程时,从svn同步下来后,,启动竟然报找不到数据源错误,本来以为很简单解决找了两个小时,现在记录下来. Exception: Name jdbc is not b ...

  5. 了解Android的编译器

    了解一下Android的编译器并记录下来: Android在4.4以前是使用Dalvik VM的,通过Just In Time(JIT即时编译)来完成编译工作,在Android4.4提供了一种测试版本 ...

  6. Android开发之JavaMail发送邮件(用户反馈)

    给APP增加了一个用户反馈的小功能,由于懒的搭服务器,所以就用邮件的形式进行通信,有如下两种方式: 1.使用调用手机上的其他程序完成邮件发送 2.使用javamail进行邮件发送 这里果断使用java ...

  7. web自学网站

    coursera 网站很多新的技术,都是大牛和牛大学的,和外国新技术.   我要自学网 有好也有不怎么样的,一般般的.但是dome多.   中国教程网  一般.   CSDN   技术相关    站长 ...

  8. for(String s:v)

    s是遍历后赋值的变量,v是要遍历的list.可以通过以下语句进行测试: List<String> v=new ArrayList(); v.add("one"); v. ...

  9. 从客户端(Content="<p>测试</p>")中检测到有潜在危险的 Request.Form 值

    .NetFrameWork 4.0 Validaterequest="false"不起作用 要恢复到2.0的ASP.NET请求验证功能的行为,要在以下设置 Web.config中 ...

  10. Process Explorer使用图文教程

    这是一款由Sysinternals开发的Windows系统和应用程序监视工具,目前Sysinternals已经被微软收购,此款不仅结合了文件监视和注册表监视两个工具的功能,还增加了多项重要的增强功能, ...