counting seconds

**hantz** · 11-11-2007, 02:56 AM

i am searching some script that counting seconds...
for example
1..2..3..4..5..6..7..8..9..10!
stopes after 10 and do nothing....

has someone cross over script like this?

**Twey** · 11-11-2007, 03:51 AM

Erm...

Code:

  <script type="text/javascript">
    function count(el, start, stop) {
      el = el.firstChild || el.appendChild(document.createTextNode(""));
      start = start || 0;
      stop = stop || 10;

      var c = start,
        inc = function() {
          if (c > stop) {
            clearInterval(t);
            el = null;
          } else
            el.nodeValue = c++;
        },
        t = setInterval(inc, 1000);
    }
  </script>
</head>
<body>
  <p onclick="count(this);">Click here to begin counting.</p>

**hantz** · 11-11-2007, 08:59 PM

i already have a script:

Code:

<body onLoad="setTimeout('check_Redirect()', 30000);">
                 
<script type="text/javascript">
function check_Redirect(){
               document.getElementById("alertmsg").innerHTML = "<p style='background:#000000;color:#ffffff;'>You have 10 seconds left!"</p>;
                       }

<div id="alertmsg" name="alertmsg"></div>
     </script>

i need to add this counting function inside of this script in order that when the timeout will shoot, that the seconds will strat running.

i tried to fit this script to my script but it not working...just doing nothing...can you show me how to combine them ?

**Twey** · 11-11-2007, 10:18 PM

Code:

  <style type="text/css">
    .timer {
      color: white;
      background-color: black;
    }
  </style>
  <script type="text/javascript">
    function count(el, start, stop) {
      el = el.firstChild || el.appendChild(document.createTextNode(""));
      start = start || 0;
      stop = stop || 10;

      var c = start,
        inc = function() {
          if (c > stop) {
            clearInterval(t);
            el = null;
          } else
            el.nodeValue = c++;
        },
        t = setInterval(inc, 1000);
    }

    onload = function() {
      setTimeout(function() { count(document.getElementById("timer")); }, 30000);
    };
  </script>
</head>
<body>
  <p class="timer">You have <span id="timer">plenty of time</span> left.</p>

**hantz** · 11-12-2007, 07:02 AM

twey, i need to use

Code:

<body onLoad="setTimeout('check_Redirect()', 30000);">

and the counting function got to be part of this script

how can i do this?

**hantz** · 11-12-2007, 07:03 AM

please look at my script and tell me where i got wrong...

Code:

<body onLoad="setTimeout('if(c==null) c=setInterval('startClock()',1000);', 50000);">
                  <script type="text/javascript">
                        var c=null;
                        var ctr=10;
                        function startClock(theLink){
                              var o=document.getElementById('sec');
                              var s=ctr<10?" second":" seconds";
                              o.innerHTML="<p style='background:#000000;color:#ffffff;'>You have "+(ctr) +s +" left</p>";
                              ctr--;
                              if(ctr<0){clearInterval(c); return false;}

                        }


                  </script>
            </head>
<body>
      <div id="sec"></div>

if i call the script like this;
<input type="button" value="Start" onClick="if(c==null) c=setInterval('startClock()',1000);">
it is working
but i need it to be called from the timeout as i tried above...

**Twey** · 11-12-2007, 07:23 AM

The snippet of code you provided uses a couple of bad practices, namely inline event handlers and passing strings to setTimeout(). Additionally, camel-casing "onload" breaks compatibility with XHTML for no reason. I suggest dropping it in favour of my script-assigned event handler. Your attempt also uses inline style and innerHTML, again signs of bad coding: inline style causes unnecessary duplication and mitigates a lot of the benefits of using CSS in the first place, and innerHTML is non-standard and will not work in XHTML pages, unnecessarily reducing reliability and portability.

**hantz** · 11-12-2007, 08:08 AM

then how we use your code inside the check_Redirect()
that will be called with

Code:

<body onLoad="setTimeout('check_Redirect()', 30000);">

?

**Twey** · 11-12-2007, 08:19 AM

Don't call it like that. It's bad. It does the equivalent already here:

Code:

    onload = function() {
      setTimeout(function() { count(document.getElementById("timer")); }, 30000);
    };

**hantz** · 11-12-2007, 09:19 AM

Code:

  <script type="text/javascript">
    function count(el, start, stop) {
      el = el.firstChild || el.appendChild(document.createTextNode(""));
      start = start || 10;
      stop = stop || 0;

      var c = start,
        inc = function() {
          if (c < stop) {
            clearInterval(t);
            el = null;
          } else
            el.nodeValue = c--;
        },
        t = setInterval(inc, 1000);
    }

    onload = function() {
      setTimeout(function() { count(document.getElementById("timer")); }, 10000);
    };
  </script>
</head>
<body>
  <div id="timer"></div>

i am using "div"
i want that it will apear on screen only when the timeout over...
+i want that there will be a black background=#000000 and white font #ffffff
how i can add those things?

if this script can be run from <body onLoad="setTimeout('????()', 30000);">
i will be happy to know how

Thread: counting seconds

Thread Tools

Search Thread

counting seconds

twey...i agree with u...

Bookmarks

Bookmarks

Posting Permissions