CODEWITHSUNDEEP
javascripttimercountdown
Wayne Rooney
Wayne Rooney

Reputation: 1607

Not getting the countdown feature in my webpage

I am making a contest platform ..For it I need a countdown timer ..The problem is that I donno JS ..So I googled up and got this script for the timer..But It is not working in the webpage...Please help me out.. Here is the code for the timer...I am getting the box for the div tag but not the timer in it...Please help me coz I am complete new bie in JS..

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title>CoBo:Contest</title>
        <link href="css/master.css" rel="stylesheet" type="text/css"/>
        <script>
          function start(myD, myH, myMins, mySecs, myL) {
              var d = new Date();//  Returns the Day (number) so we can set it to default
              currentDay = d.getDate();
              var month = 0;//  '*' for next month, '0' for this month or 1 through 12 for the month 
              var day = myD;//  Offset for day of month day or + day  
              var hour = myH;//  0 through 23 for the hours of the day
              var minutes = myMins;//  Minutes of the hour to End on
              var seconds = mySecs;//  Seconds of the minute to End on
              var tz =  - 7;//  Offset for your timezone in hours from UTC
              var lab = myL;//  The id of the page entry where the timezone countdown is to show
              displayTZCountDown(setTZCountDown(month, day, hour, minutes, seconds, tz), lab);
          }

          function setTZCountDown(month, day, hour, minutes, seconds, tz) {
              var toDate = new Date();
              if (month == '*')
                  toDate.setMonth(toDate.getMonth() + 1);
              else if (month > 0) {
                  if (month <= toDate.getMonth())
                      toDate.setYear(toDate.getYear() + 1);
                  toDate.setMonth(month - 1);
              }
              if (day.substr(0, 1) == '+') {
                  var day1 = parseInt(day.substr(1));
                  toDate.setDate(toDate.getDate() + day1);
              }
              else {
                  toDate.setDate(day);
              }
              toDate.setHours(hour);
              toDate.setMinutes(minutes - (tz * 60));
              toDate.setSeconds(seconds);
              var fromDate = new Date();
              fromDate.setMinutes(fromDate.getMinutes() + fromDate.getTimezoneOffset());
              var diffDate = new Date(0);
              diffDate.setMilliseconds(toDate - fromDate);
              return Math.floor(diffDate.valueOf() / 1000);
          }

          function displayTZCountDown(countdown, tzcd) {
              if (countdown < 0)
              document.getElementById(tzcd).innerHTML = "<b>Ended</b>";
              else {
                  var secs = countdown % 60;
                  if (secs < 10)
                  secs = '0' + secs;
                  var countdown1 = (countdown - secs) / 60;
                  var mins = countdown1 % 60;
                  if (mins < 10)
                  mins = '0' + mins;
                  countdown1 = (countdown1 - mins) / 60;
                  var hours = countdown1 % 24;
                  var days = (countdown1 - hours) / 24;
                  if (hours < 10) {
                      var hours = "0" + hours;
                  }
                  document.write(hours + ":" + mins + ":" + secs);
                  document.getElementById(tzcd).innerHTML = hours + ':' + mins + ':' + secs;
                  setTimeout('displayTZCountDown(' + (countdown - 1) + ',\'' + tzcd + '\');', 999);
              }
        </script>
    </head>
    <body>
        <div id="sidebar-top">
            <div id="inner">
                <script>
                          start('9', '25', '12', '00', '00', 'myTimerID');
                </script>
            </div>
        </div>
    </body>
</html>

Upvotes: 1

Views: 187

Answers (2)

Wayne Rooney
Wayne Rooney

Reputation: 1607

Btw I just made it perfect and small..Just pass the differnce of the target and present epoch times to the function and it gives the result :)

function displayTZCountDown(countdown, tzcd) {
            if (countdown < 0) {
                document.getElementById(tzcd).innerHTML = "Ended";
                window.location="../contest.php";
            }
            else {
                var secs = countdown % 60;
                if (secs < 10) secs = '0' + secs;
                var countdown1 = (countdown - secs) / 60;
                var mins = countdown1 % 60;
                if (mins < 10) mins = '0' + mins;
                countdown1 = (countdown1 - mins) / 60;
                var hours = countdown1 % 24;
                var days = (countdown1 - hours) / 24;
                if (hours < 10) {
                    hours = "0" + hours;
                }
                document.getElementById(tzcd).innerHTML = hours + ':' + mins + ':' + secs;
                setTimeout('displayTZCountDown(' + (countdown - 1) + ',\'' + tzcd + '\');', 999);
            }
        }

Here tzcd is the html id where I want to write and countdown is targetepoch-currentepoch

Upvotes: 0

Reinder Wit
Reinder Wit

Reputation: 6615

Looking at your script, it seems your HTML is missing an element with ID 'myTimerID'

Upvotes: 3

Related Questions