<Divclass= "Timebox"Data-times= "2019/06/30,23:59:59">from the end<spanclass= "Time Date">00</span>days<spanclass= "Time Hour">00</span> : <spanclass= "Time Minutes">00</span> : <spanclass= "Time Seconds">00</span> </Div><Divclass= "Timebox"Data-times= "2017/07/25,20:20:20">from the end<spanclass= "Time Date">00</span>days<spanclass= "Time Hour">00</span> : <spanclass= "Time Minutes">00</span> : <spanclass= "Time Seconds">00</span> </Div><Divclass= "Timebox"Data-times= "2018/05/10,18:30:00">from the end<spanclass= "Time Date">00</span>days<spanclass= "Time Hour">00</span> : <spanclass= "Time Minutes">00</span> : <spanclass= "Time Seconds">00</span> </Div><Divclass= "TimeBox2"Data-times= "2018/05/10,20:20:20">from the end<spanclass= "Time Hour">00</span> : <spanclass= "Time Minutes">00</span> : <spanclass= "Time Seconds">00</span> </Div>
* {padding:0;margin:0;}Body{font-size:16px;}. Timebox{Color:#6dbec5;margin:10px Auto;}. TimeBox2{Color:#12ae53;margin:10px Auto;}. Time{Border:1px solid #6dbec5;width:40px;Height:20px;text-align:Center;Line-height:20px;Display:Inline-block;}
varendtime,nowtime,lefttime,d,h,m,s;varSh;$.fn.countdown=function(_boolean,_this) {varSH = []; //var _this = $ (this);_this.each (function(Index, EL) {varThisobj = $ ( This); Sh[index]=setinterval (function(){ varTimes = Thisobj.data ("Times");//gets the data value of the Timebox, which is the end timeEndtime =NewDate (times);//Convert data value to timeNowtime =NewDate ();//Get current TimeLefttime=parseint ((Endtime.gettime ()-nowtime.gettime ())/1000); End time-The current time gets the number of milliseconds, divided by 1000 to get two time difference in secondsif(_boolean) {d=parseint (lefttime/3600/24); H=parseint ((lefttime/3600)%24); }Else{d=parseint (LEFTTIME/3600/24) *24; H=parseint ((lefttime/3600)%24) +d;} m=parseint ((LEFTTIME/60)%60); S=parseint (lefttime%60); if(Endtime.gettime () <=Nowtime.gettime ()) {D= h = m = s = "0"; Clearinterval (Sh[index]); } //Three mesh operatorD = d < 10? "0" +d:d; H= h < 10? "0" +h:h; M= M < 10? "0" +m:m; S= S < 10? "0" +s:s; if(_boolean) {Thisobj.find (". Date"). Text (d); } thisobj.find (". Hour"). Text (h); Thisobj.find (". Minutes"). Text (m); Thisobj.find (". Seconds"). text (s); if(lefttime<=0){ //d = h = m = s = "XX";Thisobj.find (' span '). Hide (); Thisobj.html ("<b> End of event </b>"); Clearinterval (Sh[index]); } },1000); });}//called$(". Timebox"). Countdown (true, $ (". Timebox"));$(". TimeBox2"). Countdown (true, $ (". TimeBox2"));
jquery page Multiple Countdown effect