<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>活动倒计时代码(精确到毫秒)jquery插件 - 懒人建站 http://www.51xuediannao.com/</title>
</head> <body> <script type="text/javascript" src="http://libs.useso.com/js/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript">
$.extend($.fn,{
//懒人建站 http://www.51xuediannao.com/
fnTimeCountDown:function(d){
this.each(function(){
var $this = $(this);
var o = {
hm: $this.find(".hm"),
sec: $this.find(".sec"),
mini: $this.find(".mini"),
hour: $this.find(".hour"),
day: $this.find(".day"),
month:$this.find(".month"),
year: $this.find(".year")
};
var f = {
haomiao: function(n){
if(n < 10)return "00" + n.toString();
if(n < 100)return "0" + n.toString();
return n.toString();
},
zero: function(n){
var _n = parseInt(n, 10);//解析字符串,返回整数
if(_n > 0){
if(_n <= 9){
_n = "0" + _n
}
return String(_n);
}else{
return "00";
}
},
dv: function(){
//d = d || Date.UTC(2050, 0, 1); //如果未定义时间,则我们设定倒计时日期是2050年1月1日
var _d = $this.data("end") || d;
var now = new Date(),
endDate = new Date(_d);
//现在将来秒差值
//alert(future.getTimezoneOffset());
var dur = (endDate - now.getTime()) / 1000 , mss = endDate - now.getTime() ,pms = {
hm:"000",
sec: "00",
mini: "00",
hour: "00",
day: "00",
month: "00",
year: "0"
};
if(mss > 0){
pms.hm = f.haomiao(mss % 1000);
pms.sec = f.zero(dur % 60);
pms.mini = Math.floor((dur / 60)) > 0? f.zero(Math.floor((dur / 60)) % 60) : "00";
pms.hour = Math.floor((dur / 3600)) > 0? f.zero(Math.floor((dur / 3600)) % 24) : "00";
pms.day = Math.floor((dur / 86400)) > 0? f.zero(Math.floor((dur / 86400)) % 30) : "00";
//月份,以实际平均每月秒数计算
pms.month = Math.floor((dur / 2629744)) > 0? f.zero(Math.floor((dur / 2629744)) % 12) : "00";
//年份,按按回归年365天5时48分46秒算
pms.year = Math.floor((dur / 31556926)) > 0? Math.floor((dur / 31556926)) : "0";
}else{
pms.year=pms.month=pms.day=pms.hour=pms.mini=pms.sec="00";
pms.hm = "000";
//alert('结束了');
return;
}
return pms;
},
ui: function(){
if(o.hm){
o.hm.html(f.dv().hm);
}
if(o.sec){
o.sec.html(f.dv().sec);
}
if(o.mini){
o.mini.html(f.dv().mini);
}
if(o.hour){
o.hour.html(f.dv().hour);
}
if(o.day){
o.day.html(f.dv().day);
}
if(o.month){
o.month.html(f.dv().month);
}
if(o.year){
o.year.html(f.dv().year);
}
setTimeout(f.ui, 1);
}
};
f.ui();
});
}
});
</script>
<div style="padding: 50px;">活动倒计时代码(精确到毫秒)jquery插件 - <a href="http://www.51xuediannao.com/js/jquery/">jquery插件</a>懒人建站:http://www.51xuediannao.com/</div>
<div style="background:rgb(183,17,41); WIDTH: 100%; color:#fff;FONT-FAMILY: arial; TEXT-ALIGN: center;">
<P style="font-size:.8em;line-height:2em;">距活动结束还有:</P>
<div id="fnTimeCountDown" data-end="2018/07/08 18:45:13">
<span class="year">00</span>年
<span class="month">00</span>月
<span class="day">00</span>天
<span class="hour">00</span>时
<span class="mini">00</span>分
<span class="sec">00</span>秒
<span class="hm">000</span>
</div>
</div>
<script type="text/javascript">
$("#fnTimeCountDown").fnTimeCountDown("2018/07/08 18:45:13");
</script> </body>
</html>

  

活动倒计时代码(精确到毫秒)jquery插件的更多相关文章

  1. 前端js倒计时(精确到毫秒)

    话不多说,直接上代码: 有需要直接拿走, <html> <head> <style> div{ width:100%; text-align:center; fon ...

  2. C#代码精确到毫秒时间戳写法

                 TimeSpan ts = new TimeSpan(DateTime.Now.Ticks);            ts.TotalMilliseconds;  

  3. 第四十三课:jQuery插件化

    我们先来看一个最简单的例子: (function($){ $.fn.extend({     //把此插件添加到jQuery的原型上 pluginName:function(){   //插件的名字 ...

  4. jQuery插件实战之fullcalendar(日历插件)Demo

    jQuery的插件许多,应用的场景也很丰富,今天我这里给大家介绍一款很有用的日历页面开发插件 - fullcalendar,眼下最新版本号是1.5.1,使用这款插件可以高速帮助你高速编程实现基于web ...

  5. 如何开发jQuery插件

    一:普及JQuery知识 知识1:用JQuery写插件时,最核心的方法有如下两个: $.extend(object) 可以理解为,为JQuery 类添加一个静态方法. $.fn.extend(obje ...

  6. jQuery插件开发,jquery插件

    关于jQuery插件的开发自己也做了少许研究,自己也写过多个插件,在自己的团队了也分享过一次关于插件的课.开始的时候整觉的很复杂的代码,现在再次看的时候就清晰了许多.这里我把我自己总结出来的东西分享出 ...

  7. [Jquery 插件]活动倒计时,可同步服务器时间,倒计时格式随意设置

    活动倒计时,可同步服务器时间,倒计时格式随意设置 使用说明 /* #活动倒计时,可同步服务器时间 startTime:起始时间 endTime:结束时间 format_str:字符模板 speed:倒 ...

  8. PHP精确到毫秒秒杀倒计时实例

    精确到毫秒秒杀倒计时PHP源码实例,前台js活动展示倒计时,后台计算倒计时时间.每0.1秒定时刷新活动倒计时时间. PHP: // 注意:php的时间是以秒算.js的时间以毫秒算 // 设置时区 da ...

  9. jquery倒计时代码

    jquery倒计时代码<pre> <span id="day_show">0天</span> <strong id="hour_ ...

随机推荐

  1. Power Network (最大流增广路算法模板题)

    Time Limit: 2000MS   Memory Limit: 32768K Total Submissions: 20754   Accepted: 10872 Description A p ...

  2. POJ2513 Colored Sticks(欧拉)

    题目链接. 题目大意: 给很多木棍,两端被涂了颜色.任意两根木棍的相同颜色处可以拼接在一起,问有没有可能将所有的木棍都连起来,成一条直线? 分析: 考点,欧拉道路. 将一根木棍看成一条边,两端的颜色看 ...

  3. POJ2253 Frogger(最短路)

    题目链接. 题意: 从0号点,到1号点,找一条能通过的路,使得这条路中的最大的边,比其它所有可能的路中的边都小. 分析: 这题就是按着dijkstra写,写着写着觉得像是prim了. 其中d[n]表示 ...

  4. CentOS 6.4 安装 Fcitx4.0

    一.首先安装中文支持: su root yum install "@Chinese Support" exit yum remove ibus 注销再登陆 二.安装fcitx 下载 ...

  5. Introduction to Web Services

    What are Web Services? Web Services are client and server applications that communicate over the Wor ...

  6. yum nfs

    linux下3大文件共享方法 1.NFS NFS服务器配置 编辑/etc/exports,在文件中列出,要共享的目录.书写规则是:共享目录主机(参数).并且每条规则占据一行.例如: /mnt/mp3 ...

  7. URAL 1081

    题目大意:求词典序下第K个长度为N且无相邻位置都为1的0.1序列.无解时输出-1. 例如: input:     output: 3 1        000(所有符合条件的序列有:000,001,0 ...

  8. QT5 TK1 串口通信

    对TK1中基于QT5的串口通信过程进行总结.按照软件安装及通信实现的顺序. 1.QT5安装 较简洁方式:打开软件中心(类似A形),搜索qtcreator,点击安装即可. 2.串口通信库安装 采用上述方 ...

  9. XML (DOM解析) 看看就行

    000000000000000000000000000000000000000 ------------------------------------------------------------ ...

  10. motan源码分析一:服务发布及注册

    motan是新浪微博开源的服务治理框架,具体介绍请看:http://tech.sina.com.cn/i/2016-05-10/doc-ifxryhhh1869879.shtml. 本系列的文章将分析 ...