Heim > Web-Frontend > js-Tutorial > So implementieren Sie jQuery-Seiten-Countdown- und Aktualisierungseffekte

So implementieren Sie jQuery-Seiten-Countdown- und Aktualisierungseffekte

小云云
Freigeben: 2018-01-22 16:26:55
Original
2307 Leute haben es durchsucht

Wir alle wissen, dass auf vielen Websites ein großer Bedarf an Seiten-Countdown-Editor besteht. Dieser Artikel teilt Ihnen hauptsächlich einen Teil des JQ-Codes mit, um den Seiten-Countdown- und Aktualisierungseffekt zu erzielen. Der Code ist einfach und leicht zu verstehen, sehr gut , Freunde, die es brauchen, können darauf verweisen. Ich hoffe, es hilft allen.

Der folgende Code teilt Ihnen den Seiten-Countdown und den Aktualisierungseffekt basierend auf JQuery mit. Der Code lautet wie folgt:


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);
    });
Nach dem Login kopieren


<span class="timeShow"></span>
Nach dem Login kopieren

Verwandte Empfehlungen:

js HTML-Seiten-Countdown auf Sekunden genau_html/css_WEB-ITnose

JQuery-Imitation Xiaomi-Handy-Rush-Kaufseite Countdown-Effekt_jquery

Javascript-Seiten-Countdown-Beispiel_Javascript-Fähigkeiten

Das obige ist der detaillierte Inhalt vonSo implementieren Sie jQuery-Seiten-Countdown- und Aktualisierungseffekte. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage