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> ...
随机推荐
- python基础(五)列表,元组,集合
列表 在python中是由数个有序的元素组成的数据结构,每一个元素对应一个index索引来隐式标注元素在列表中的位置.是python中最常用的一种数据类型.需要注意的是列表中可以有重复相同的数据. 列 ...
- 北斗卫星同步时钟(NTP网络时钟服务器)成功投运世界级工程港珠澳大桥
北斗卫星同步时钟(NTP网络时钟服务器)成功投运世界级工程港珠澳大桥 北斗卫星同步时钟(NTP网络时钟服务器)成功投运世界级工程港珠澳大桥 本文由北京华人开创科技公司提供 原址在 http://www ...
- 在阿里云 ECS 搭建 nginx https nodejs 环境(三、nodejs)
在阿里云 ECS 搭建 nginx https nodejs 环境(三.nodejs) 在阿里云 ECS 搭建 nginx https nodejs 环境(三.nodejs) 第一步 指定版本源 执行 ...
- AFN中请求序列化的设置
最近遇到一个需求:要求从客户端传到服务器的参数是json字符串,于是我本能的用pod装了afn然后进行了request和response Serialization的相关设置 AFHTTPSessio ...
- WebAPI 实现前后端分离
随着Web技术的发展,现在各种框架,前端的,后端的,数不胜数.全栈工程师的压力越来越大. 现在的前端的框架,既可以做各种Web,又可以做各种APP,前端框架更新换代越来越快,越来越多. 传统的模式 前 ...
- SpringMVC的映射器、适配器、解析器
1.处理器和适配器 1.1springmvc的映射器 根据客户端请求的url,找到处理本次请求的handler(处理器),将url和controller关联起来 1.2springmvc的适配器 对映 ...
- CommonJS,AMD,RequireJS的区别
RequireJS实现了AMD的API. CommonJS是使用exports对象来定义模块的一种方法,它定义了模块的内容.简单地实现一个CommonJS的定义就像下面这样: // someModul ...
- CodeForces723-A. The New Year: Meeting Friends
A. The New Year: Meeting Friends time limit per test 1 second memory limit per test 256 megabytes in ...
- android企业级商城源码、360°全景图VR源码、全民直播源码等
Android精选源码 [新版]Android技术博客精华汇总 开源了:乐乐音乐5.0-Android音乐播放器 android实现仿真水波纹效果源码 360°全景图VR,这是一个值得把玩的APP a ...
- python基础1 day2
一.上节课回顾1. 编译型: 将源码一次性全部编译成二进制. C 优点:执行效率高. 缺点:开发效率慢,不可跨平台使用. 解释型: 当程序执行时,代码一行一行的去解释成二进制. python 优点:开 ...