javascript - Need help invoking a function for a countdown -
i have been provided js provides function counting down dates within array. need invoking it. in other words, how execute function , provide correct html display countdown? have div html , script, here is:
<div class="container-full"> <div class="row"> <div class="col-md-12" id="countdown"> <h3> <span id="next-term"></span> starts: <span id="date_container"></span> </h3> <div id="countdown"> <div id="weeks_container" class="countdown_container"> <div id="weeks">0</div> <div id="weeks-text">weeks</div> </div> <div id="days_container" class="countdown_container"> <div id="days">0</div> <div id="days-text">days</div> </div> </div> <span id="register-time-left-text">you still have <span id="register-time-left"></span> days left register <span id="live-term"></span>. </span> <script> function countdowndate() { //countdown var nextdate; var nextterm; var livedate; var liveterm; var arrstartdates = new array(); //for testing //arrstartdates[0] = new date(2014,03,18); arrstartdates[0] = new date(2016, 0, 04); arrstartdates[1] = new date(2016, 01, 15); arrstartdates[2] = new date(2016, 03, 04); arrstartdates[3] = new date(2016, 04, 16); arrstartdates[4] = new date(2016, 06, 05); arrstartdates[5] = new date(2016, 07, 15); arrstartdates[6] = new date(2016, 09, 03); arrstartdates[7] = new date(2016, 10, 14); arrstartdates[8] = new date(2017, 0, 02); arrstartdates[9] = new date(2017, 01, 13); arrstartdates[10] = new date(2017, 03, 03); arrstartdates[11] = new date(2017, 04, 15); arrstartdates[12] = new date(2017, 06, 03); arrstartdates[13] = new date(2017, 07, 14); arrstartdates[14] = new date(2017, 09, 02); arrstartdates[15] = new date(2017, 10, 13); arrstartdates[16] = new date(2018, 0, 02); arrstartdates[17] = new date(2018, 01, 12); arrstartdates[18] = new date(2018, 03, 02); arrstartdates[19] = new date(2018, 04, 14); arrstartdates[20] = new date(2018, 06, 02); arrstartdates[21] = new date(2018, 07, 13); arrstartdates[22] = new date(2018, 09, 01); arrstartdates[23] = new date(2018, 10, 12); var arrtermnames = new array(); arrtermnames[0] = ("winter quarter 2016"); arrtermnames[1] = ("winter quarter 2016"); arrtermnames[2] = ("spring quarter 2016"); arrtermnames[3] = ("spring quarter 2016"); arrtermnames[4] = ("summer quarter 2016"); arrtermnames[5] = ("summer quarter 2016"); arrtermnames[6] = ("fall quarter 2016"); arrtermnames[7] = ("fall quarter 2016"); arrtermnames[8] = ("winter quarter 2017"); arrtermnames[9] = ("winter quarter 2017"); arrtermnames[10] = ("spring quarter 2017"); arrtermnames[11] = ("spring quarter 2017"); arrtermnames[12] = ("summer quarter 2017"); arrtermnames[13] = ("summer quarter 2017"); arrtermnames[14] = ("fall quarter 2017"); arrtermnames[15] = ("fall quarter 2017"); arrtermnames[16] = ("winter quarter 2018"); arrtermnames[17] = ("winter quarter 2018"); arrtermnames[18] = ("spring quarter 2018"); arrtermnames[19] = ("spring quarter 2018"); arrtermnames[20] = ("summer quarter 2018"); arrtermnames[21] = ("summer quarter 2018"); arrtermnames[22] = ("fall quarter 2018"); arrtermnames[23] = ("fall quarter 2018"); //determine date today today = new date(); //milliseconds per day msperday = 24 * 60 * 60 * 1000; (var = 0; < arrstartdates.length; i++) { if (today.gettime() < arrstartdates[i].gettime()) { nextdate = arrstartdates[i]; nextterm = arrtermnames[i]; livedate = arrstartdates[i]; liveterm = arrtermnames[i]; break; } } (var = 0; < arrstartdates.length; i++) { if (today.gettime() < (arrstartdates[i].gettime() + (msperday * 3))) { livedate = arrstartdates[i]; liveterm = arrtermnames[i]; break; } } //do not edit information //term date termtime = new date(nextdate); //time today beginning of term timeleft = (termtime.gettime() - today.gettime()); //to total number of days left, divide total time left time length of 1 day e_daysleft = (timeleft / msperday); //to number of weeks left, divide total numbers of days 7 e_wksleft = (e_daysleft / 7); //calculate amount of days left in current week , display number without decimals daysleft = math.floor(e_daysleft % 7); //display number without decimals wksleft = math.floor(e_wksleft); //define variables write month, day, , year of current start date y = nextdate.getfullyear(); //we add "1" month because in javascript, january expressed "0", not "1". m = nextdate.getmonth() + 1; d = nextdate.getdate(); //write results on page $('#next-term').html(nextterm); $('#date_container').html(m + '/' + d + '/' + y); $('#weeks').html(wksleft); $('#days').html(daysleft); $('#live-term').html(liveterm); //if weeks value less 10 add "0" in front of remaining value if (wksleft <= 9) { $('#weeks').html("  " + wksleft); } if (nextdate != livedate) { livedate = livedate.gettime() + (msperday * 4); termtime = new date(livedate); timeleft = (termtime.gettime() - today.gettime()); $('#register-time-left-text').css("display", "block"); $('#register-time-left').html(math.floor((timeleft / msperday))); } } </script> </div> </div> </div>
not sure if i'm missing key component, putting in wrong spot, or what. haven't touched provided js, , hoping right html ingredients make work if possible. thank you.
you need add this:
$(function(){ countdowndate(); });
function countdowndate() { //countdown var nextdate; var nextterm; var livedate; var liveterm; var arrstartdates = new array(); //for testing //arrstartdates[0] = new date(2014,03,18); arrstartdates[0] = new date(2016, 0, 04); arrstartdates[1] = new date(2016, 01, 15); arrstartdates[2] = new date(2016, 03, 04); arrstartdates[3] = new date(2016, 04, 16); arrstartdates[4] = new date(2016, 06, 05); arrstartdates[5] = new date(2016, 07, 15); arrstartdates[6] = new date(2016, 09, 03); arrstartdates[7] = new date(2016, 10, 14); arrstartdates[8] = new date(2017, 0, 02); arrstartdates[9] = new date(2017, 01, 13); arrstartdates[10] = new date(2017, 03, 03); arrstartdates[11] = new date(2017, 04, 15); arrstartdates[12] = new date(2017, 06, 03); arrstartdates[13] = new date(2017, 07, 14); arrstartdates[14] = new date(2017, 09, 02); arrstartdates[15] = new date(2017, 10, 13); arrstartdates[16] = new date(2018, 0, 02); arrstartdates[17] = new date(2018, 01, 12); arrstartdates[18] = new date(2018, 03, 02); arrstartdates[19] = new date(2018, 04, 14); arrstartdates[20] = new date(2018, 06, 02); arrstartdates[21] = new date(2018, 07, 13); arrstartdates[22] = new date(2018, 09, 01); arrstartdates[23] = new date(2018, 10, 12); var arrtermnames = new array(); arrtermnames[0] = ("winter quarter 2016"); arrtermnames[1] = ("winter quarter 2016"); arrtermnames[2] = ("spring quarter 2016"); arrtermnames[3] = ("spring quarter 2016"); arrtermnames[4] = ("summer quarter 2016"); arrtermnames[5] = ("summer quarter 2016"); arrtermnames[6] = ("fall quarter 2016"); arrtermnames[7] = ("fall quarter 2016"); arrtermnames[8] = ("winter quarter 2017"); arrtermnames[9] = ("winter quarter 2017"); arrtermnames[10] = ("spring quarter 2017"); arrtermnames[11] = ("spring quarter 2017"); arrtermnames[12] = ("summer quarter 2017"); arrtermnames[13] = ("summer quarter 2017"); arrtermnames[14] = ("fall quarter 2017"); arrtermnames[15] = ("fall quarter 2017"); arrtermnames[16] = ("winter quarter 2018"); arrtermnames[17] = ("winter quarter 2018"); arrtermnames[18] = ("spring quarter 2018"); arrtermnames[19] = ("spring quarter 2018"); arrtermnames[20] = ("summer quarter 2018"); arrtermnames[21] = ("summer quarter 2018"); arrtermnames[22] = ("fall quarter 2018"); arrtermnames[23] = ("fall quarter 2018"); //determine date today today = new date(); //milliseconds per day msperday = 24 * 60 * 60 * 1000; (var = 0; < arrstartdates.length; i++) { if (today.gettime() < arrstartdates[i].gettime()) { nextdate = arrstartdates[i]; nextterm = arrtermnames[i]; livedate = arrstartdates[i]; liveterm = arrtermnames[i]; break; } } (var = 0; < arrstartdates.length; i++) { if (today.gettime() < (arrstartdates[i].gettime() + (msperday * 3))) { livedate = arrstartdates[i]; liveterm = arrtermnames[i]; break; } } //do not edit information //term date termtime = new date(nextdate); //time today beginning of term timeleft = (termtime.gettime() - today.gettime()); //to total number of days left, divide total time left time length of 1 day e_daysleft = (timeleft / msperday); //to number of weeks left, divide total numbers of days 7 e_wksleft = (e_daysleft / 7); //calculate amount of days left in current week , display number without decimals daysleft = math.floor(e_daysleft % 7); //display number without decimals wksleft = math.floor(e_wksleft); //define variables write month, day, , year of current start date y = nextdate.getfullyear(); //we add "1" month because in javascript, january expressed "0", not "1". m = nextdate.getmonth() + 1; d = nextdate.getdate(); //write results on page $('#next-term').html(nextterm); $('#date_container').html(m + '/' + d + '/' + y); $('#weeks').html(wksleft); $('#days').html(daysleft); $('#live-term').html(liveterm); //if weeks value less 10 add "0" in front of remaining value if (wksleft <= 9) { $('#weeks').html("  " + wksleft); } if (nextdate != livedate) { livedate = livedate.gettime() + (msperday * 4); termtime = new date(livedate); timeleft = (termtime.gettime() - today.gettime()); $('#register-time-left-text').css("display", "block"); $('#register-time-left').html(math.floor((timeleft / msperday))); } } countdowndate();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="container-full"> <div class="row"> <div class="col-md-12" id="countdown"> <h3> <span id="next-term"></span> starts: <span id="date_container"></span> </h3> <div id="countdown"> <div id="weeks_container" class="countdown_container"> <div id="weeks">0</div> <div id="weeks-text">weeks</div> </div> <div id="days_container" class="countdown_container"> <div id="days">0</div> <div id="days-text">days</div> </div> </div> <span id="register-time-left-text">you still have <span id="register-time-left"></span> days left register <span id="live-term"></span>. </span> </div> </div> </div>
Comments
Post a Comment