Welcome to WebmasterServe!

FREE TO JOIN! Join us now to engage in informative and friendly discussions about Webmastering, SEO, SEM, Internet Marketing, Programming, Graphic Design, Online Jobs and more. What are you waiting for? Ready to join our friendly community? It takes just one minute to register.

Dismiss Notice

Join WebmasterServe Forums 
Join the discussion! Have a better idea or an opinion? It takes just one minute to register Click Here to Join

My 2 Cents Htc-style javascript countdown timer with jquery

Discussion in 'Javascript and jQuery' started by JavaScriptBank, Apr 28, 2011.

Thread Status:
Not open for further replies.
  1. JavaScriptBank

    Yellow Belt

    Joined:
    Jul 11, 2009
    Messages:
    85
    Ratings:
    +0 / -0
    If the JavaScript countdown timers are ever presented on jsB@nk still do not satisfy you:

    - Cool JavaScri... detail at JavaScriptBank.com - 2.000+ free JavaScript codes


    How to setup

    Step 1: Use CSS code below for styling the script
    CSS
    Code:
    Select All
    <link rel="stylesheet" type="text/css" href="style.css" />
    Step 2: Place JavaScript below in your HEAD section
    JavaScript
    Code:
    Select All
    <script src="/javascript/jquery.js" type="text/javascript"></script> <script src="jquery.countdown.packed.js" type="text/javascript"></script> <script type="text/javascript"> $(function () { $('#countdown').countdown({until:$.countdown.UTCDate(-8, 2011, 1 - 1, 1), format: 'DHMS', layout: '<div id="timer">' + '<hr />'+ '<div id="timer_days" class="timer_numbers">{dnn}</div>'+ '<div id="timer_hours" class="timer_numbers">{hnn}</div>'+ '<div id="timer_mins" class="timer_numbers">{mnn}</div>'+ '<div id="timer_seconds" class="timer_numbers">{snn}</div>'+ '<div id="timer_labels">'+ '<div id="timer_days_label" class="timer_labels">days</div>'+ '<div id="timer_hours_label" class="timer_labels">hours</div>'+ '<div id="timer_mins_label" class="timer_labels">mins</div>'+ '<div id="timer_seconds_label" class="timer_labels">secs</div>'+ '</div>'+ '</div>' }); }); </script>
    Step 3: Copy & Paste HTML code below in your BODY section
    HTML
    Code:
    Select All
    <div id="countdown"></div>
    Step 4: downloads
    Files
    countdown1.png
    countdown2.png
    jquery.countdown.packed.js
    style.css






     
Thread Status:
Not open for further replies.

Share This Page