JS实现倒计时
HTML部分:
<div class="div">
<div id="div"> </div>
</div>
CSS部分:
*{margin:; padding:;}
.div{width:100%;height:636px;background: linear-gradient(to top, #333 0%, #fff 100%);}
#div{box-sizing: border-box;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-100%);font-family: STXingkai;font-size: 50PX;}
JS部分:
function biao2(){
var div = document.getElementById("div");
var dt = new Date("2018-1-12 12:00:00") - new Date(); //假设倒计时时间为明天十二点开始减去今天的时间, 算出明天距离今天所剩的毫秒数
if(dt>0){
hours=Math.floor(dt/1000/60/60%24);
min=Math.floor(dt/1000/60%60);
sec=Math.floor(dt/1000%60);
}
div.innerHTML="倒计时:"+hours+"时"+min+"分"+sec+"秒";
}
setInterval("biao2()",1000);
JS实现倒计时的更多相关文章
- 倒计时的js实现 倒计时 js Jquery
by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=987 一.如火如荼的团 ...
- 一个简单的js实现倒计时函数
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- js时间倒计时
看了网上的其他的例子,觉得写的都有点复杂,不好理解,于是自己动手写了个. 本来想封装成jquery插件,但是觉得因为功能很简单,没有必要做成jquery插件,引用的时候不需要引入jqery库,这里直接 ...
- js实现倒计时及时间对象
JS实现倒计时效果代码如下: <!doctype html> <html> <head> <meta charset="utf-8"> ...
- js 验证码 倒计时60秒
js 验证码 倒计时60秒 <input type="button" id="btn" value="免费获取验证码" /> & ...
- JS实现倒计时(天数,时,分,秒)
<!DOCTYPE html> <html> <head> <meta charset="utf-8" > <titl ...
- 使用html+css+js实现倒计时,开启你痛苦的倒计时吧
使用html+css+js实现倒计时,开启你痛苦的倒计时吧 效果图: 这是我痛苦的倒计时,呜呜呜 好啦,再痛苦还是要分享代码,代码如下,复制即可使用: <!DOCTYPE html> &l ...
- js网页倒计时精确到秒级
网页实时倒计时,精确到秒级,和天数倒计时原理一样. 一个很好用的js倒计时!网页实时倒计时,精确到秒级,和天数倒计时原理一样.js倒计时一般用于商城网站团购,特卖,很多地方都可用到!希望能够给大家带来 ...
- js实现倒计时60秒的简单代码
<!DOCTYPE html> <html lang="en"> <head> <meta http-equiv="Conten ...
- 用JS实现倒计时(日期字符串作为参数)
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
随机推荐
- PHP读取excel中地址实现多文件下载
PHP文件下载有单文件和多文件之分,如果是单文件写个方法可以实现,但是如果想循环下载多个文件我试验是没有成功.先说单文件的下载,方法如下: function downfile($fileurl) { ...
- es7 await/async解决异步问题
最近做项目遇到一个问题,前端调用ie浏览器中的ocx的方法去查询数据,查询完之后ocx给一个返回值,然后js将返回值当参数传入到另外的函数中去做数据处理,但是遇到一个问题是前端需要异步去执行这个过程 ...
- 转深入理解 AngularJS 的 Scope作用域
文章转载英文:what-are-the-nuances-of-scope-prototypal-prototypical-inheritance-in-angularjs 中文:http://www. ...
- 【读书笔记】【深入理解ES6】#6-Symbol和Symbol属性
在ES5及早期版本中,JS语言包含5中原始类型: 字符串型 数字型 布尔型 null undefined ES6引入了第六种原始类型: Symbol 创建Symbol let firstName = ...
- LevelDB的源码阅读(三) Put操作
在Linux上leveldb的安装和使用中我们写了这么一段测试代码,内容以及输出结果如下: #include <iostream> #include <string> #inc ...
- Python面试题解答
1. 一个谜题 >>> t = (1, 2, [30, 40]) >>> t[2] += [50, 60] 到底会发生下面 4 种情况中的哪一种? a. t变成(1 ...
- 基于Flask实现博客开发--准备工作
背景说明 本项目是基于<深入理解flask>一书,主要是用来记录学习历程和交流心得,所以写得不好请大神勿喷. 准备工作 virtualenv介绍 也许 Virtualenv 是你在开发中最 ...
- 记录WEUI中滚动加载的一个BUG
最近写微信公众号,用到的技术栈是jq+vue的混合开发,采用的UI是移动端比较火的WEUI,在微信开发中应该较广泛.个人看惯了elementUI文档,相对于饿了么组件文档的详细,WEUI的文档还是比较 ...
- 微信小程序登陆授权
小程序前端代码 function WXlogin(){ wx.login({ success: function (code) { wx.getUserInfo({ success:function( ...
- 几道数位DP
因为这几天写的几道数位DP大多都太水..而且也确实没什么好讲所以就扔到一起了. [hdu4772]Good Numbers 要求统计区间内 各位数之和能被10整除 的数的个数. 练手,f[i][j][ ...