Countdown js code that can be used multiple times on the same page

Source: Internet
Author: User

I found a lot of js countdown codes on the Internet, but they can only be used once on the same page. I finally saw a page from a friend's blog that can call the countdown js Code multiple times. I will share it with you.

Today, we need to implement multiple countdown functions on one page, but after searching for it online for a long time, we only see some plug-ins that have already been written in jquery.
However, jquery cannot be used in my project (there are too many reasons, such as conflicts with the system library), and a K jquery library is introduced for such a function,
It's also a waste of resources. You have to add the plug-in library to make it bigger,
Forced by the rogue, I found a js in ecshop and changed it into multiple countdown times on a single page. Although it is not perfect, it is basically usable.
Leave it to those who need it;

 

/**
Change to one page to display multiple countdown times

Call method:
Onload_leftTime (start timestamp, end timestamp, display ID );
For example:

Onload_leftTime (1322603631,1352793600, 'lefttime ');
Onload_leftTime (1322603631,1352793600, 'lefttime1 ′);
Onload_leftTime (1322603631,1352793600, 'lefttime2 ′);

**/

The Code is as follows: Copy code

Var timerRunning = [];
Var timerID = [];
Var auctionDate = [];
Var startTime = [];
Var showTimeId = [];

Function showtime (){
Var _ day = 'day ';
Var _ hour = 'hourly ';
Var _ minute = 'Min ';
Var _ second = 'second ';
Var _ end = 'terminal ';
Var dateLeft = 0;
Var hourLeft = 0;
Var minuteLeft = 0;
Var secondLeft = 0;
Var hourZero = ";
Var minuteZero = ";
Var secondZero = ";

Var c = auctionDate. length;

For (var I = 0, j = auctionDate. length; I <j; I ++ ){

If (auctionDate [I] = null ){
C -;
Continue;
}
Now = new Date ();
Var ts = parseInt (startTime [I]-now. getTime ()/1000) + auctionDate [I];

If (ts <0 ){
Ts = 0;
CurHour = 0;
CurMinute = 0;
CurSecond = 0;
} Else {
DateLeft = parseInt (ts/86400 );
Ts = ts-dateLeft * 86400;
HourLeft = parseInt (ts/3600 );
Ts = ts-hourLeft * 3600;
MinuteLeft = parseInt (ts/60 );
SecondLeft = ts-minuteLeft * 60;
}

If (hourLeft <10 ){
HourZero = '0 ′;
}
If (minuteLeft <10 ){
MinuteZero = '0 ′;
}
If (secondLeft <10) {secondZero = '0';} if (dateLeft> 0 ){
Temp = dateLeft + _ day + hourZero + hourLeft + _ hour + minuteZero + minuteLeft + _ minute + secondZero + secondLeft + _ second;
} Else {
If (hourLeft> 0 ){
Temp = hourLeft + _ hour + minuteZero + minuteLeft + _ minute + secondZero + secondLeft + _ second;
} Else {
If (minuteLeft> 0 ){
Temp = minuteLeft + _ minute + secondZero + secondLeft + _ second;
} Else {
If (secondLeft> 0 ){
Temp = secondLeft + _ second;
} Else {
Temp = ";
}
}
}
}

If (ts Temp = "<strong>" + _ end + "</strong> ";
AuctionDate [I] = null;
}

If (document. getElementById (showTimeId [I]) {
Document. getElementById (showTimeId [I]). innerHTML = Temp;
}

TimerRunning [I] = true;

}

If (c> 0 ){
TimerID = setTimeout ("showtime ()", 1000 );
}

}

Function stopclock (timerRunning, timerID ){
If (timerRunning ){
ClearTimeout (timerID );
}
TimerRunning = false;
}

Function onload_leftTime (now_time, gmt_end_time, showTime ){

Var auctionDate_tmp = 0;
Var _ GMTEndTime = 0;

Var cur_date = new Date ();

_ GMTEndTime = gmt_end_time;

If (_ GMTEndTime> 0 ){
If (now_time = undefined ){
Var tmp_val = parseInt (_ GMTEndTime)
-ParseInt (cur_date.getTime ()/1000
+ Cur_date.getTimezoneOffset () * 60 );
} Else {
Var tmp_val = parseInt (_ GMTEndTime)-now_time;
}

If (tmp_val> 0 ){
AuctionDate_tmp = tmp_val;
}

}

TimerRunning [timerRunning. length] = false;
TimerID [timerID. length] = null;
AuctionDate [auctionDate. length] = auctionDate_tmp;
StartTime [startTime. length] = cur_date.getTime ();
ShowTimeId [showTimeId. length] = showTime;

Showtime ();

}

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.