Home > Web Front-end > JS Tutorial > How to implement jQuery page countdown and refresh effects

How to implement jQuery page countdown and refresh effects

小云云
Release: 2018-01-22 16:26:55
Original
2280 people have browsed it

We all know that the page countdown editor has such a need on many websites. This article mainly shares with you a piece of jq code to achieve the page countdown and refresh effect. The code is simple and easy to understand, very good, friends who need it can refer to it. Hope it helps everyone.

The following code will share with you the page countdown and refresh effect based on jquery. The code is as follows:


var intDiff = parseInt(600);//倒计时总秒数量
    function timer(intDiff){
      window.setInterval(function(){
      var day=0,
        hour=0,
        minute=0,
        second=0;//时间默认值    
      if(intDiff > 0){
        day = Math.floor(intDiff / (60 * 60 * 24));
        hour = Math.floor(intDiff / (60 * 60)) - (day * 24);
        minute = Math.floor(intDiff / 60) - (day * 24 * 60) - (hour * 60);
        second = Math.floor(intDiff) - (day * 24 * 60 * 60) - (hour * 60 * 60) - (minute * 60);
      }else{//当时间耗尽,刷新页面
        window.location.reload();
      }
      if (minute <= 9) minute = &#39;0&#39; + minute;
      if (second <= 9) second = &#39;0&#39; + second;
      $(".timeShow").html(&#39;本页数据还剩下<font>&#39;+minute+&#39;分&#39;+second+&#39;</font>秒刷新,刷新间隔时间: 10 分钟&#39;);
      intDiff--;
      }, 1000);
    } 
    $(function(){
      timer(intDiff);
    });
Copy after login


<span class="timeShow"></span>
Copy after login

Related recommendations:

js html page countdown accurate to seconds_html/css_WEB-ITnose

JQuery imitation Xiaomi phone Rush purchase page countdown effect_jquery

javascript page countdown example_javascript skills

The above is the detailed content of How to implement jQuery page countdown and refresh effects. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template