jquery时间倒计时
代码:
js:
function countDown(time, id) { //time的格式yyyy/MM/dd hh:mm:ss
var day_elem = $(id).find('.day');
var hour_elem = $(id).find('.hour');
var minute_elem = $(id).find('.minute');
var second_elem = $(id).find('.second');
var end_time = new Date(time).getTime(), //月份是实际月份-1
sys_second = (end_time - new Date().getTime()) / 1000;
var timer = setInterval(function () {
if (sys_second > 1) {
sys_second -= 1;
var day = Math.floor((sys_second / 3600) / 24);
var hour = Math.floor((sys_second / 3600) % 24);
var minute = Math.floor((sys_second / 60) % 60);
var second = Math.floor(sys_second % 60);
day_elem && $(day_elem).text(day); //计算天
$(hour_elem).text(hour < 10 ? "0" + hour : hour); //计算小时
$(minute_elem).text(minute < 10 ? "0" + minute : minute); //计算分钟
$(second_elem).text(second < 10 ? "0" + second : second); //计算秒杀
} else {
clearInterval(timer);
}
}, 1000);
}
html:
<p id="colockbox">
<span class="day" id="day">00</span>
<span class="hour">00</span>:
<span class="minute">24</span>:
<span class="second">24</span>
</p>
jquery时间倒计时的更多相关文章
- js时间倒计时
看了网上的其他的例子,觉得写的都有点复杂,不好理解,于是自己动手写了个. 本来想封装成jquery插件,但是觉得因为功能很简单,没有必要做成jquery插件,引用的时候不需要引入jqery库,这里直接 ...
- jQuery实现倒计时效果-杨秀徐
本实例效果:剩余368天22小时39分57秒结束 代码简单易懂,适用各种倒计时: <!DOCTYPE html> <head> <title>jQuery实现倒计时 ...
- jquery.countdown 倒计时插件的学习
1.第一种简单的使用 第一个时间是你的倒计时截止时间,finalDate格式可以是YYYY/MM/DD MM/DD/YYYY YYYY/MM/DD hh:mm:ss MM/DD/YYYY hh:mm: ...
- jquery实现倒计时
<html> <head> <meta charset="utf-8"/> <title>jquery实现倒计时</title ...
- jQuery控制倒计时
1.1 秒杀的倒计时 做秒杀网页总免不了倒计时,但没有很好的服务器,啥资源都没有,只能将部分任务交给浏览器去处理,比如秒杀首页的倒计时,因为真正秒杀是在具体页面,首页只是展示而已,所以误差一点是允许的 ...
- jquery时间轴幻灯展示源代码
查看效果:http://hovertree.com/texiao/jquery/75/ 源代码下载:http://hovertree.com/h/bjaf/8jlpc2wu.htm 效果图如下: 代码 ...
- jQuery时间格式插件-moment.js的使用
jQuery时间格式插件-moment.js的使用 moment.js插件的使用,使用之前在页面引入对应的js文件: 详细的操作可见moment中文官网:http://momentjs.cn/ 日期格 ...
- jQuery时间轴插件timeline.js
http://www.jq22.com/jquery-info13695 http://www.jq22.com/jquery-info13357 简要教程 timeline.js是一款jQuery时 ...
- 发展简史jQuery时间轴特效
发展简史jQuery时间轴特效.这是一款鼠标滚动到一定的高度动画显示企业发展时间轴特效.效果图如下: 在线预览 源码下载 实现的代码. html代码: <div class="wr ...
随机推荐
- push
1:收到通知的那一刻,app的状态可能是未启动,前台以及后台 如果未启动,等待点击app的时候进行界面跳转的时候接收到通知(didFinishLaunchngWithOPtions) 如果是前台以及后 ...
- java.lang.ClassCastException: android.widget.RelativeLayout cannot be cast to android.widget.TextView
最近在学习drawerLayout时,遇到这个bug.如下示: java.lang.ClassCastException: android.widget.RelativeLayout cannot b ...
- win32api 获取文件版本信息
#coding:utf-8 myPath="C:\\ime" import os from win32api import GetFileVersionInfo, LOWORD, ...
- 循环不变量loop invariant 与 算法的正确性
在论述插入排序的正确性的时候, 书中引入了循环不变量的概念, 刚开始稍微有点不太明白, 早上查了一波资料之后决定把自己的理解记录下来. 什么是循环不变量 ? 在我看来, 所谓循环不变量的就是一个在循环 ...
- 【实(dou)力(bi)首(mai)发(meng)】第四次CCF软件能力认证题解
这次的题总体上相对前三次偏简单.由于实力有限,就分析前四题. 试题编号: 201503-1 试题名称: 图像旋转 时间限制: 5.0s 内存限制: 256.0MB 问题 ...
- NOIP2016初赛总结(提高组)
题目:https://www.zhihu.com/question/51865837/answer/127892121 注:我是HE的,不是JS的,照片是ZYJ神犇的 单选 一.单项选择题(共15 题 ...
- Longest Palindromic Substring
题目:https://leetcode.com/problems/longest-palindromic-substring/ 算法分析 这道题的解法有三种:暴力法.动态规划.Manacher算法.三 ...
- css省略号
效果图如下: 效果图如下:
- linux ps命令
名称:ps 使用权限:所有使用者 使用方式:ps [options] [--help] 说明:显示瞬间行程 (process) 的动态 参数: ps 的参数非常多, 在此仅列出几个常用的参数并大略介绍 ...
- linux用户、组管理及权限(一)
一.用户管理 1.为什么需要用户 1)计算机及网络资源的合理分配 2)可以控制用户访问系统的权限.3)身份认证 4) 进程 以某个用户的身份来运行 2.用户分类 用户的角色是通过UID(用户ID)来 ...