locked
Timer RRS feed

  • Question

  • User-1148495280 posted

    How To create a count down timer for a quiz

    Wednesday, May 21, 2014 6:00 AM

Answers

  • User2103319870 posted

    You can also try with the below code

    Change the number passed to the function "startCountdown' found in the body tag to the amount of seconds you want.

    <html>
    <head>
    <title></title>
    <script>
        function startCountdown(timeLeft) {
            var interval = setInterval( countdown, 1000 );
            update();
    
            function countdown() {
                if ( --timeLeft > 0 ) {
                    update();
                } else {
                    clearInterval( interval );
                    update();
                    completed();
                }
            }
    
            function update() {
                hours   = Math.floor( timeLeft / 3600 );
                minutes = Math.floor( ( timeLeft % 3600 ) / 60 );
                seconds = timeLeft % 60;
    
                document.getElementById('time-left').innerHTML = '' + hours + ':' + minutes + ':' + seconds;
            }
    
            function completed() {
              alert('Time Up!');
              //Your Logic here
            }
        }
    </script>
    </head>
    <body onload="startCountdown(20);">
    Time Left <span id="time-left"></span>
    </body>
    </html>
    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, May 21, 2014 7:28 AM

All replies

  • User-1353043493 posted

    http://keith-wood.name/countdown.html

    Default.aspx: 
    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
    
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head id="Head1" runat="server">
        <title>Untitled Page</title>
    </head>
    <body>
        <form id="form1" runat="server">
            <asp:ScriptManager ID="ScriptManager1" runat="server" />
            <div>
                <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                    <ContentTemplate>
                        <asp:Timer ID="Timer1" runat="server" Interval="1000" OnTick="Timer1_Tick">
                        </asp:Timer>
                        <asp:Label ID="Label1" runat="server"></asp:Label>
                    </ContentTemplate>
                </asp:UpdatePanel>
            
    
            </div>
        </form>
    </body>
    </html>
     
    
    Default.aspx.cs: 
    
    using System;
    using System.Data;
    using System.Configuration;
    using System.Collections;
    using System.Web;
    using System.Web.Security;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using System.Web.UI.WebControls.WebParts;
    using System.Web.UI.HtmlControls;
    
    public partial class _Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                Session["time"] = DateTime.Now.AddSeconds(40);
            }
        }
        protected void Timer1_Tick(object sender, EventArgs e)
        {
            TimeSpan time1 = new TimeSpan();
            time1 = (DateTime)Session["time"] - DateTime.Now;
            if (time1.Seconds <= 0)
            {
                Label1.Text = "TimeOut!";
            }
            else
            {
                Label1.Text = time1.Seconds.ToString();
            }
            
        }
    }

    Wednesday, May 21, 2014 6:28 AM
  • User1326971216 posted

    try this

    http://www.codeproject.com/Answers/308812/How-to-implement-countdown-timer-in-asp-net-using-.aspx#answer1

    Wednesday, May 21, 2014 7:24 AM
  • User2103319870 posted

    You can also try with the below code

    Change the number passed to the function "startCountdown' found in the body tag to the amount of seconds you want.

    <html>
    <head>
    <title></title>
    <script>
        function startCountdown(timeLeft) {
            var interval = setInterval( countdown, 1000 );
            update();
    
            function countdown() {
                if ( --timeLeft > 0 ) {
                    update();
                } else {
                    clearInterval( interval );
                    update();
                    completed();
                }
            }
    
            function update() {
                hours   = Math.floor( timeLeft / 3600 );
                minutes = Math.floor( ( timeLeft % 3600 ) / 60 );
                seconds = timeLeft % 60;
    
                document.getElementById('time-left').innerHTML = '' + hours + ':' + minutes + ':' + seconds;
            }
    
            function completed() {
              alert('Time Up!');
              //Your Logic here
            }
        }
    </script>
    </head>
    <body onload="startCountdown(20);">
    Time Left <span id="time-left"></span>
    </body>
    </html>
    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, May 21, 2014 7:28 AM