<!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. RandomAccessFile和memory-mapped files

    [0]README 0.1) 本文描述转自 core Java volume 2, 旨在理解 java流与文件——RandomAccessFile类解析 的相关知识: 0.1) 本文 转自: http ...

  2. haskell 开发环境配置

    haskell是一门通用函数式语言,几乎可以进行任何种类的开发,包括命令行,GUI,数据库,Web.源代码可以跨平台: Linux,Mac, Windows, FreeBSD 等. haskell特点 ...

  3. Android UI开发第三十一篇——Android的Holo Theme

    好长时间没写Android UI方面的文章了,今天就闲扯一下Android的Holo主题.一直做android开发的可能都知道,Android 系统的UI有过两次大的变化,一次是android 3.0 ...

  4. COJ 0985 WZJ的数据结构(负十五)(限定区域不同数)

    传送门:http://oj.cnuschool.org.cn/oj/home/addSolution.htm?problemID=955 试题描述: CHX有一个问题想问问大家.给你一个长度为N的数列 ...

  5. [Design Pattern] Iterator Pattern 简单案例

    Iterator Pattern,即迭代时模式,按照顺序依次遍历集合内的每一个元素,而不用了解集合的底层实现,属于行为类的设计模式.为了方便理解记忆,我也会称其为遍历模式. 下面是一个迭代器模式的简单 ...

  6. 首届京东自有品牌科技周“京东点亮生活”圆满成功 - 课程公告板 - 京东内部论坛 - Powered by Discuz!

    首届京东自有品牌科技周"京东点亮生活"圆满成功 - 课程公告板 - 京东内部论坛 - Powered by Discuz! 首届京东自有品牌科技周"京东点亮生活" ...

  7. C++ —— 类的基础

    C++类的设计与基础       2015.9.11 1.变量和常量的命名:确定程序中的变量.常量.函数的名字都是具有描述性的名字,具有直接的意义.如numberOfStudent 比 numOfSt ...

  8. 工作那些事(四)大公司VS小公司

    都说大公司学做人,小公司学做事.这话有一定的道理,但是也不是绝对的.做人简单地说就是与人打交道,为人处世:做事,对我们来说就是实现需求,解决bug.有句话,是这么说的:有人的地方就有江湖,有江湖,就得 ...

  9. android中网络操作使用总结(http)

    Android是作为智能手机的操作系统,我们开发的应用,大多数也都须要连接网络,通过网络发送数据.获取数据,因此作为一个应用开发人员必须熟悉怎么进行网络訪问与连接.通常android中进行网络连接通常 ...

  10. java socker编程

    转自http://haohaoxuexi.iteye.com/blog/1979837 对于Java Socket编程而言,有两个概念,一个是ServerSocket,一个是Socket.服务端和客户 ...