2012-07-27

How to create a simple countdown using javascripts

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ClientDisplayForserver.aspx.cs" Inherits="ClientDisplayForserver" %>
<!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 runat="server">
    <title>Untitled Page</title>
    <script>
       function GetCount(amount) {
           document.getElementById('test').innerHTML = amount;
           if (amount == 0)
               clearTimeout();
           else
               setTimeout(function () { GetCount(amount - 1) }, 1000);
       }
</script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <span id="test">Test<br />
        <br />
    </span>&nbsp;<asp:Button ID="Button1" runat="server" OnClientClick="GetCount(30); return false" Text="Button" /></div>
    </form>
</body>
</html>

The above sample code is for a countdown when the user press the button. Here it will go from 30. You can change the parameter pass to the GetCount() method,

No comments: