zoukankan      html  css  js  c++  java
  • jquery实现倒计时

     1 <html>
     2 <head>
     3     <meta charset="utf-8"/>
     4     <title>jquery实现倒计时</title>
     5     <script src="js/jquery-1.8.3.min.js" type="text/javascript"></script>
     6 </head> 
     7  
     8 <body> 
     9 <div id="remainTime" style="font-size:20px;font-weight:800;color:#FF9900"></div> 
    10 
    11 <script type="text/javascript">
    12     $(function(){
    13         var now=new Date();
    14         var end=new Date(2018,2,3,16,10,00);//结束的时间:年,月,日,分,秒(月的索引是0~11)
    15         /*两个时间相减,得到的是毫秒ms,变成秒*/
    16         var result=Math.floor(end-now)/1000; 
    17         
    18         var interval=setInterval(sub,1000); //定时器 调度对象
    19         /*封装减1秒的函数*/
    20         function sub(){
    21             if (result>1) {
    22                result = result - 1; 
    23                var second = Math.floor(result % 60);     // 计算秒 ,取余  
    24                var minite = Math.floor((result / 60) % 60); //计算分 ,换算有多少分,取余,余出多少秒
    25                var hour = Math.floor((result / 3600) % 24); //计算小时,换算有多少小时,取余,24小时制除以24,余出多少小时
    26                var day = Math.floor(result / (3600*24));  //计算天 ,换算有多少天
    27              
    28                $("#remainTime").html(day + "天" + hour + "小时" + minite + "分" + second + "秒");
    29             } else{
    30                 alert("倒计时结束!");
    31                 window.clearInterval(interval);//这里可以添加倒计时结束后需要执行的事件 
    32             }
    33         };
    34     });
    35 </script>
    36 </body>
    37 </html>
  • 相关阅读:
    图片灰度化,并且resize图片
    C语言学习笔记
    路飞学城14天集训营作业2—三级菜单
    路飞学城14天集训营作业4—员工信息表
    路飞学城14天集训营作业3—购物车
    路飞学城14天集训营作业1—登陆认证
    js钩子函数
    APP2.0后台控件API
    KindEditor 插件API使用说明
    TreeView插件 API
  • 原文地址:https://www.cnblogs.com/tongzhou/p/6513962.html
Copyright © 2011-2022 走看看