GDragoN supports this item


This author's response time can be up to 5 business days.

40 comments found.


wonderful plugin, I have a small issue. I need to set up multiple timers on a page and ideally I would like to get the timer value from a data- attribute as the timers will be different. Any solutions on how to do this easily?

thanks in advance

Plugin requires settings all values in JavaScript. But, if you have values in HTML as data attributes, you can add extra JavaScript that will first read these data and use it to form values you can than use in the jQuery for Timer plugin.


How to make COUNTDOWN TIMER not to RESET TIMER every refresh of the page ?

How to connect it with COOKIE , so refresh page will not reset the timer ?



If you set countdown to specific date/time, you don’t need to set anything else. If this is not it, can you explain how you want to set countdown?


I set up TIMER (countdown) for 2hrs, so someone visit website timer starts, visitor refresh page but TIMER must still keep going (without RESET to 2hrs again) this must be connected with cookie. Once timer goes to zero it stays there until cookie is deleted. Thank You!

I have tutorial for this: and full example. But, you need to know that because it is using cookie, counter will count only while the page is open by the user. You have the code there, and you can modify it the way you need it, it is showcase on how to use cookies with plugin own callbacks.

Regards, Milan

I bought this widget for my HTML site. I am using the countdown with days, hours, minutes and seconds. In what file (and where) do I change the countdown? I can’t find it in the tutorial…

I read that one, and I see the code in the tutorial of how to edit the counter…. but I can’t find that code in any of my javascript files. Since you’re the author and I bought it, do you mind giving me a hint in which file I should look to edit the counter that’s on my page?

With any JavaScript plugin you need to understand basics of how it works, and that is why there are so many examples included along with documentation and everything else. But, I can’t teach you how to use jQuery plugins and customize it.

From what I can see you have copied everything from my demo, but you also need to understand how it works.

I can’t post full code here, it doesn’t format well, but at the end of your page HTML source, you have copied code to apply = jQuery(”#stac-example-one”).smartTimerCounter… and you need to adjust that init code to the example I have pointed to you in the demo file. I have no idea how you put your files together and how they are created, but what I can see is that the code is part of your page, near the bottom.

Regards, Milan

Thanks for your help!

Is there a way to set a begin time in this configuration? I haven’t seen it working with smartTimerCounter. I want it to start at a certain time and go up until manually stopped. It all works fine except for this one requirement. The reason for this is the CallAutoSave commits the value to a session and DB in case they close the window and ignore prompts to not do that.

    skin: "Animated", mode: "Counter", callbacks: { change: CallAutoSave },
    display: { style: "crystal-light", space: "10px", animation: "SlideUp" },
    model: { layout: "h m s", method: "target" }


This configuration starts from 0 until reaches target value. From what I understand, you want it only to start from value other than 0, value you can set in configuration?

If that is the case, this can’t be done right now, but it is planned for next minor 3.1 version. I hope to have this version released in the next 2-3 days.

Is this the feature you need, or maybe I have misunderstood what you need?



Is it possible to use the counter from the start date chosen? So for example my client would like to do it from the start of the company back in 1988?

Would need to read, Years, Months, Days, Hours and Minutes?

Is that something your plugin can do?

Format for the date/time display are all in the documentation. You have several PDF files in the docs folder in the plugin package. Month is ‘M’.

working now. Just need to resize. thank you

Most skins use CSS for size (font-size applied to wrapper), circle skin has size in pixels.


Hello, excellent plug in here.

Before I buy, I have a question.

I saw that you posted a tutorial on how to use cookie based timer.

However, as you pointed out, cookie based timers a flawed. Modern timers are I.P based.

This means that a 3 day offer can be a 3 day offer per customer then it runs out.

Do you know how to make the timer say a 3 day offer that is I.P based?

If so could you show us a tutorial? If this is a an extra job for you to do, how much would it be?

Thank you

Excellent work



The only way to have precise timer method is to use server side tracking of visitors and their IP addresses, and use server side code to generate values JavaScript counter will use to display correct values for each visitor.

I am extremely busy, so I don’t have time right now to develop tutorial for this (it needs database use to track individual IP’s, and it depends on your server side language and environment too).

Regards, Milan

I have a questions about a model field. I’m using the counter for currency and I have 8 digits total (including 2 decimals). However, it is putting a comma after the first number when there shouldn’t be one. Here is my example. How can I get rid of the comma?

Thanks for reporting this, I will check it out and release the fix.

Problem found and fixed. Updated version will be released later today.

Hi there, The timer works great! Thank you! However, I am having a small issue because I am using the timer with a landing page/ email launching program. That means that all of my javascript and css must be included in the html file – no separate directories. When I include all of the code, my timer alignment appears vertically rather than horizontally. Do you have a fix for this?

*CODE <!DOCTYPE html PUBLIC ”-//W3C//DTD XHTML 1.0 Transitional//EN” “”> <html xmlns=””>

<head> <meta http-equiv=”Content-Type” content=”text/html; charset=utf-8”> <title>Bill Bonner Letter</title> <script type=”text/javascript” src=””></script> <style type=”text/css”> body { margin: 0; padding: 0; }

@media only screen and (max-width: 660px) { table.container { width: 375px !important } td.logo img { display: none; } td.logo { margin-left: auto; margin-right: auto; width: 320px; height: 55px; background: url( no-repeat 18px 10px; } td.headline { font-size: 32px !important } table.billbonner { display: none; } { display: none; } table.byline-date { width: 100%; } } @media only screen and (max-width: 510px) { table.container { width: 100% !important } .redcounter { margin-bottom: -20px; } @media screen and (max-device-width: 375px) { table.container { width: 100% !important; } td.logo img { display: none; } td.logo { width:100%; height:55px; background: url( no-repeat; } @media screen and (max-device-width: 320px) { table.container { width: 100% !important; } td.logo img { display: none; } td.logo { width:100%; height:55px; background: url( no-repeat; } /*TIMER*/ /dist/counter.core.min.css/ .smart-timer-and-counter { margin-top:3px; margin-bottom:7px } .smart-timer-and-counter { margin-top:7px; margin-bottom:3px } .smart-timer-and-counter .stc-digit { display:inline-block } .smart-timer-and-counter .stc-divider-dot, .smart-timer-and-counter .stc-divider-space, .smart-timer-and-counter .stc-divider-period, .smart-timer-and-counter .stc-divider-line, .smart-timer-and-counter .stc-divider-colon, .smart-timer-and-counter .stc-divider-comma { position:relative } .smart-timer-and-counter .stc-divider-dot:after, .smart-timer-and-counter .stc-divider-period:after, .smart-timer-and-counter .stc-divider-colon:before, .smart-timer-and-counter .stc-divider-colon:after { opacity:1; background-color:#000; border-radius:50%; content:””; height:5px; width:5px; left:50%; top:66%; margin-left:-3px; position:absolute } .smart-timer-and-counter .stc-divider-comma:after { border-color:#000 transparent; border-radius:3px 3px 0 0; border-style:solid; border-width:6px 6px 0 0; content:””; height:1px; left:50%; margin-left:-5px; opacity:1; position:absolute; top:66%; transform:rotate(90deg); width:3px } .smart-timer-and-counter .stc-divider-dot:before { top:50% } .smart-timer-and-counter .stc-divider-colon:before { top:33% } .smart-timer-and-counter .stc-divider-line:after { opacity:1; background-color:#000; border-radius:100%; content:””; height:50%; width:2px; left:50%; top:25%; margin-left:-1px; position:absolute } .smart-timer-and-counter, .smart-timer-and-counter, .smart-timer-and-counter, .smart-timer-and-counter, .smart-timer-and-counter, .smart-timer-and-counter, .smart-timer-and-counter { opacity:.1 } /dist/ .stc-skin-plain { font-size:30px; line-height:34px } .stc-skin-plain .sct-after { clear:both } .stc-skin-plain .stc-group, .stc-skin-plain .stc-divider { float:left; text-align:center } .stc-skin-plain .stc-group-digits, .stc-skin-plain .stc-group-label { clear:both } .stc-skin-plain .stc-group-digits { height:1.5em; line-height:1.5em } .stc-skin-plain .stc-divider { height:2em } .stc-skin-plain .stc-digit { font-size:30px } .stc-skin-plain .stc-group { padding:1em } .stc-skin-plain .stc-divider { padding:1em 0 } .stc-skin-plain, .stc-skin-plain { margin:0 }

/dist/ @media screen and (max-width: 960px) { .stc-skin-simple, .stc-skin-circular, .stc-skin-animated, .stc-skin-custom, .stc-skin-plain { font-size:13px } } @media screen and (max-width: 800px) { .stc-skin-simple, .stc-skin-animated, .stc-skin-custom, .stc-skin-plain { font-size:11px } .stc-skin-circular { font-size:12px } } @media screen and (max-width: 480px) { .stc-skin-simple, .stc-skin-animated, .stc-skin-custom, .stc-skin-plain { font-size:9px } .stc-skin-circular { font-size:11px } } @media screen and (max-width: 320px) { .stc-skin-simple, .stc-skin-animated, .stc-skin-custom, .stc-skin-plain { font-size:8px } .stc-skin-circular { font-size:10px } } .redcounter { margin-bottom:-70px; } </style> </head> <body bgcolor=”#ffffff”>


Bill Bonner Letter
A Whole Lot of Takin’ Goin’ On
Dear [%= :subscriberName(E, Bill Bonner Letter Reader) %],
[-—copy goes here-—]


Bill Bonner, Editor
The Bill Bonner Letter
Published by Bonner & Partners.

Bonner & Partners welcomes your feedback and questions. Simply reply to this email or click here. But please note: The law prohibits us from giving personalized advice.

You can find the members-only website at

Customer Service
To update your mailing address, email address or password, click here or click on the Manage My Account link in the Our Services dropdown menu.

To speak with our Customer Service team, please call 800-681-1765. Our office hours are Monday – Friday, 9:00 am – 5:00 pm.

Your Membership ID is: [%= :xd_paid_ctm_nbr %]. To help us with your query, please include your Membership ID when you contact us.

(C) 2015 Bonner & Partners. All Rights Reserved. Protected by copyright laws of the United States and international treaties. This newsletter, e-letter, or promotional material may only be used pursuant to the subscription agreement and any reproduction, copying, or redistribution (electronic or otherwise, including on the world wide web), in whole or in part, is strictly prohibited without the express written permission of Bonner & Partners, 14 W Mount Vernon Place, Baltimore, MD 21201, United States.

<script type=”text/javascript”> eval(function(p,a,c,k,e,r){e=function©{return(c35?String.fromCharCode(c+29):c.toString(36))};if(!’’.replace(//,String)){while(c-)r[e©]=k©||e©;k=[function(e){return r[e]}];e=function(){return’\\w+’};c=1};while(c-)if(k©)p=p.replace(new RegExp(’\\b’’\\b’,’g’),k©);return p}(‘4 5=3(){};5.8=3(b,c){“J H”;4 d=5.l.8;5.q=G;4 e=N 2();d.p(e,b);e.r=3(){};D 5.q;4 n=e.n;4 f=e.n=3(){6(!5.q){6(2.w||2.n==f){2.w=G;n.E(2,7);D 2.w}x 6(70!==F){m(70.8||d).p(70,e)}}};f.A=2;f.8=2.8;f.u=2.u;f.v=2.v;f.l=e;f.o=2.o;f.9=3(a){m(a==”z”)?f:n.9()};d.p(f,c);6(s f.y==”3”)f.y();m f};5.l={8:3(c,d){6(7.C>1){4 e=2©;6(e&&(s d==”3”)&&(!e.9||e.9()!=d.9())&&/\\L\\b/.M(d)){4 f=d.9();d=3(){4 a=2.r||5.l.r;2.r=e;4 b=f.E(2,7);2.r=a;m b};d.9=3(a){m(a==”z”)?d:f};d.o=5.o}2©=d}x 6©{4 g=5.l.8;6(!5.q&&s 2!=”3”){g=2.8||g}4 h={I:F};4 j=[“n”,”o”,”9”];4 i=5.q?0:1;K(k=j[i+]){6(c[k]!=h[k]){g.p(2,k,c[k])}}t(4 k B c){6(!h[k])g.p(2,k,c[k])}}m 2}};5=5.8({n:3(){2.8(70)}},{A:O,P:”1.1”,u:3(a,b,c){t(4 d B a){6(2.l[d]===Q){b.p(c,a[d],d,a)}}},v:3(){t(4 i=0;i<7.C;i+){6(s 7[i]==”3”){7i}x{2.l.8(7[i])}}m 2},o:3(){m R(2.9())}});’,54,54,’||this|function|var|Base|if|arguments|extend|valueOf||||||||||||prototype|return|constructor|toString|call|_prototyping|base|typeof|for|forEach|implement|_constructing|else|init|object|ancestor|in|length|delete|apply|null|true|strict|toSource|use|while|bbase|test|new|Object|version|undefined|String’.split(’|’),0,{})); </script> <script type=”text/javascript”> eval(function(p,a,c,k,e,r){e=function©{return(c35?String.fromCharCode(c+29):c.toString(36))};if(!’’.replace(//,String)){while(c-)r[e©]=k©||e©;k=[function(e){return r[e]}];e=function(){return’\\w+’};c=1};while(c-)if(k©)p=p.replace(new RegExp(’\\b’’\\b’,’g’),k©);return p}(‘p o,2Y=1;(7($,f,g,h){o=7(a,b){k 13 o.35(a,b)};2Z.2X.32=7(a,b){k 2Z(5H(b).39(a)6.5z()).6f(b)};2Z.2X.1n=7(){k 6.1X(0,1).5b()+6.1X(1)};56.2X.1d=7(a){k(Z.1d(6+”e+”a)“e“a)};o.1p=1p.U({4c:”3.1”,1x:7(a,b){8(1C a!==”2L”){a={}}8(1C b!==”2L”){b={}}6.3v($.U(1a,{},a,b))},31:7(a,b){6[a]=b},4g:7(a){8(6[a]){k 6[a]}k n},3v:7(a){p b;T(b 47 a){8(1C a[b]!==”5S”){6.31(b,a[b])}}},5Q:7(){k 6},5N:7(a,b){k Z.3H(Z.5K())+a},15:7(a){8(1C a===”7”){p b=[],i;T(i=1;i<=2T.I;i+){8(2T[i]){b.1T(2T[i])}}a.5M(6,b)}}});o.35=o.1p.U({$1O:n,$41:n,$L:n,$1E:n,$1f:n,$q:n,$42:n,$z:n,$x:0,1k:{1l:n,1h:n,1c:n,1G:n,A:n,2q:n,1g:n,3X:n},3W:{},3U:{},3T:{},q:{},L:”2x”,3S:”3R”,1f:”3Q”,3P:1a,1x:7(a,b){6.V(b);6.3O();6.$z=$(a).1o(“3N-q-5G-3M”);6.$z=$(a).1o(“3N-q-3M”);6.$q=13 o.3L(6,6.q);6.$L=6.3K(6.L,6.3W);6.$1E=6.3J(6.3S,6.3T);6.$1f=6.3I(6.1f,6.3U,6.$L.1F());6.15(6.1k.1l);8(6.3P){6.1h()}2Y+},1h:7(){6.$L.1h();6.15(6.1k.1h)},1c:7(){6.$L.1c();6.15(6.1k.1c)},1G:7(){6.$L.1G();6.15(6.1k.1G)},1R:7(a,b){6.$1f.1R(a,b)},Q:7(a){1q(a){J2W 6.$1f.2g;F;2f:k 6.$L.Q(a)}},46:7(){k 6.Q(“2W”)},3I:7(a,b,c){8(!o[a“1Y”]){a=”3Q”}k 13 oa+”1Y”},3J:7(a,b){8(!o[a+”1L”]){a=”3R”}k 13 oa+”1L”},3K:7(a,b){8(!o[a+”29”]){a=”2x”}k 13 oa+”29”},3O:7(){p a=”5R|5V|5X|63|6a|6d|43 45|2A 4d|2A 4f|2A 4V|52|53|55|59|5d|5m”;p b=13 5q(a,”5t”);6.$41=b.5u(5v.5x)}});o.3G=o.1p.U({2D:””,2J:””,26:””,9:n,2g:””,$t:{2O:”y-2O”,2Q:”y-2Q”,3F:”y-61-”,62:”y-2U-”,25:”y-1v-”,2o:”y-1z-”,3E:”y-B-”,3B:”y-1f-”,22:”y-1b-”,4T:”y-O-”,3w:”y-E-”,O:”y-O”,54:”y-O-1M”,57:”y-O-2E”,5c:”y-O-2F”,5f:”y-O-2G”,5n:”y-O-2H”,5s:”y-O-2I”,2U:”y-2U”,1v:”y-1v”,1z:”y-1z”,B:”y-1v-B”,E:”y-1v-E”},$1P:[“1M”,”2E”,”2F”,”2H”,”2G”,”2I”],$R:[],$12:[],$2N:[],20:1a,3u:1a,1M:”5L”,2P:””,1x:7(a,b,c){6.V(b);6.9=a;6.3t();6.3s©;6.3q();6.3p©},1R:7(a,b){1q(a){J20 8(b===”1U”){6.9.$z.1r(”.”6.$t.E).1U()}}F;J1P 8(b===”1U”){6.9.$z.1r(”.”+6.$t.O).1U()}F}},3p:7(a){p b;6.9.$z.1o(6.2g);6.9.$z.1o(6.$t.3B+6.2J);8(6.1b!==”“){6.9.$z.1o(6.$t.22+6.1b)}8(6.26!==”“){6.9.$z.1o(6.26)}8(6.2P!==”“){6.9.$z.1o(6.2P)}b=6.3o();8(b!==”“){6.9.$z.2s(b)}6.3n(a);b=6.3m();8(b!==”“){6.9.$z.2s(b)}6.3k();8(6.20){6.1Z()}$(f).48(“49 4a 4b”,{$1e:6},6.3h)},3h:7(e){p a=e.1K.$1e;8(a.20){a.1Z()}},1h:7(){},1c:7(){},3k:7(){},3q:7(){},2y:7(a,b){p c=a””;8(c.I>b){k c.1X(c.I-b,b)}C 8(c.Ia+”</1b>”).50(“51”)},2B:7(a){k”“},3o:7(){k\’<X 1t=”\’+6.$t.2O\’”></X>\’},3m:7(){k\’<X 1t=”\’6.$t.2Q\’”></X>\’},3c:7(a){p b=[6.$t.O],u=”O”a.1n();8(!6.3b){b.1T(6.$t[u])}k\’<X 1t=”\’+b.39(” “)\’” 1b=”28: \’6.1M\’”>&5a;</X>\’},1Z:7(){p a=2,2n=6.9.$z.2n().28();6.9.$z.1r(”.”6.$t.1v”, .”6.$t.O).1A(7(){a=$(6).5e(1a)});8(6.3u&&a<2n){6.9.$z.28(a)}C{6.9.$z.28(“2a”)}},5l:7(a){p i,u,$1e=6;T(i=0;i<6.$1y.I;i+){u=”2K”+a“3a”6.$1y[i];8($1e[u]){k 1a}}k n},5r:7(a){p b,i,1u,$1e=6,2e={};T(i=0;i<6.$1y.I;i+){1u=6.$1y[i];b=”2K”1u;2e[1u]=$1e[b]}8(a!==”“){T(i=0;i<6.$1y.I;i+){1u=6.$1y[i];b=”2K”a+”3a”+1u;8($1e[b]){2e[1u]=$1e[b]}}}k 2e}});o.1Y=o.3G.U({$1m:[“19”,”11”,”14”,”18”,”N”,”G”],1b:”5I-5J”,3b:n,38:n,1V:”2S”,2k:”2a”,1g:7(a){6.36()},36:7(){8(6.38){6.9.$z.1r(”.”+6.$t.O).5O(“y-5P”)}},1z:7(a,b){k 6.9.$z.1r(”.”+6.$t.25+a” .”6.$t.2o+b)},E:7(a){k 6.9.$z.1r(”.”+6.$t.25+a” .”6.$t.E)},34:7(a,b){8(6.1V!==”1U”&&6.2k===”2a”){p c=b===1?6.$R[a].16:6.$R[a].10;p d=6.E(a);d.P©}},3t:7(){6.2g=6.$t.3F+2Y},3n:7(a){p b,i,P;T(i=0;i<6.$12.I;i+){b=6.$12[i];8($.2m(b,6.$1P)>-1){P=6.3c(b)}C{P=6.3x(b,6.$R[b].B,6.$R[b].E,a[b])}6.9.$z.2s(P)}},3x:7(a,b,c,e){p i,u,d=6.2y(e,b),P=\’<X 1t=”\’6.$t.1v\’ \’6.$t.25+a\’”>\’;8(6.1V===”33”){P+=6.2V(c,”33”)}P+=\’<X 1t=”\’6.$t.B\’ \’6.$t.3E+b\’”>\’;T(i=0;i\’;8(6.1V===”2S”){P+=6.2V(c,”2S”)}P+=\’</X>\’;k P},2V:7(a,b){k\’<X 1t=”\’6.$t.E\’ \’6.$t.3w+b\’”>\’a+\’</X>\’},3s:7(a){p i,W,B,E,w,2l,R={19:{W:n,B:0,E:””,16:””,10:”“},11:{W:n,B:0,E:””,16:””,10:”“},14:{W:n,B:0,E:””,16:””,10:”“},18:{W:n,B:0,E:””,16:””,10:”“},N:{W:n,B:0,E:””,16:””,10:”“},G:{W:n,B:0,E:””,16:””,10:”“}};6.$12=6.9.$L.$1m;6.$2N=[];T(i=0;i<6.$12.I;i+){w=6.$12[i];8($.2m(w,6.$1P)===-1){6.$2N.1T(w)}}T(i=0;i<6.$1m.I;i+){w=6.$1m[i];W=”W”+w.1n();B=”B”+w.1n();E=”E”+w.1n();R[w].W=$.2m(w,6.$12)>-1;R[w].B=6.9.$L[B]>1?6.9.$L[B]:1;8(6.2k===”2a”){2l=6.9.$1E.37(w,a[w])}C{2l=6.9.$1E.Q(w,6.2k)}R[w].16=6.9.$1E.Q(w,”16”,a[w]);R[w].10=6.9.$1E.Q(w,”10”,a[w]);R[w].E=2l}6.$R=R}});o.44=o.1Y.U({2D:”1p”,2J:”V”,1x:7(a,b,c){6.V(a,b,c)},1g:7(a){p i,j,B,u,d,v,2c,r,27;T(i=0;i<6.$12.I;i+){u=6.$12[i];27=n;8($.2m(u,6.$1P)===-1){B=6.$R[u].B;r=3d(a[u]);d=6.2y(a[u],B);T(j=0;j\’b+\’</X>\’}});o.3L=o.1p.U({9:n,q:n,2z:0,A:3f,1x:7(a,b){6.V(b);6.9=a},1G:7(a){3g(6.q);6.4e();6.2z=0;6.2w(a)},1h:7(a){6.3i(a)},1c:7(a){6.3j(a);6.15(a)},3j:7(){3g(6.q)},3i:7(a){6.2w(a)},2w:7(a){p b=6;6.q=4i(7(){b.15(a);b.15(b.9.1k.A,b.A);b.2z+},6.A)}});o.1L=o.1p.U({4j:[“4k”,”4l”,”4m”,”4n”,”4o”,”4p”,”4q”,”4r”,”4s”,”4t”,”4u”,”4v”],4w:[“4x”,”4y”,”4z”,”4A”,”4B”,”4C”,”4D”,”4E”,”4F”,”4G”,”4H”,”4I”],16:{19:”4J”,11:”4K”,14:”4L”,18:”4M”,N:”4N”,G:”4O”},10:{19:”4P”,11:”4Q”,14:”4R”,18:”4S”,N:”2v”,G:”4U”},1x:7(a){6.V(a)},Q:7(a,b,c){8(!b){b=”10”}k 6b},37:7(a,b){k 3d(b)===1?6.Q(a,”16”,b):6.Q(a,”10”,b)},3l:7(a,b){8(!b){b=”4W”}k 6“11”b.1n()}});o.4X=o.1L.U({});o.4Y=o.1L.U({16:{19:”Y”,11:”M”,14:”D”,18:”H”,N:”M”,G:”S”},10:{19:”Y”,11:”M”,14:”D”,18:”H”,N:”M”,G:”S”}});o.29=o.1p.U({L:””,23:””,9:n,$1m:[],$1O:n,12:””,1x:7(a,b){6.V(b);6.9=a;6.2p()},1h:7(){p a=6;8(!6.$1O){6.$1O=1a;8(6.2b()){6.9.$1f.1h();6.9.$q.1h(7(){a.1g()})}C{6.1c();6.15(6.9.1k.2q)}}},1c:7(){6.$1O=n;6.9.$1f.1c();6.9.$q.1c()},1G:7(){6.1l()},2b:7(){k 1a},1g:7(){},1l:7(){},2p:7(){}});o.2R=o.29.U({L:”q”,$3r:{19 a=6.1F();6.9.$1f.1g(a);6.15(6.9.1k.1g,a);8(6.2b()===n){6.1c();6.15(6.9.1k.2q)}},3A:7(){k(13 1w).5o()603f},Q:7(a){1q(a){2f:J5p 6.$x;F}},1l:7(){6.$A=0;6.$N=0},1F:7(){},2p:7(){6.3C();6.3D();6.1l()},3C:7(){p a={Y”,” ”:”1M”,. i,w,u,2t=0,2r={19 h.m.s”,5E h.m.s”,5F h.m.s”},12:”2v”,K:”G”,17:1S,1J:0,1I:n,1g:7(){1q(6.K){J1H a=1a;1q(6.K){J1Q a},1l:7(){1q(6.K){JG a,1s,1j=13 1w();1s=1j.1i()-6.17.1i();8(1s<0){6.K=”1j”;6.1l()}C{a=Z.1d(1s/6.9.$q.A);6.$x=a6.9.$q.A}F;J1j a,1s,1j=13 1w();1s=6.17.1i()-1j.1i();a=Z.1d(1s/6.9.$q.A);8(a<0){a=0}6.$x=a6.9.$q.A;F}6.V();p b=6.1F(),1W=0,2h=””,1D=”B”+6.$1B.1n(),i,2i=[“19”,”11”,”14”,”18”,”N”,”G”];2h=b[6.$1B]””;1W=2h.I>0?2h.I:2;8(1W>0&&1W>6[1D]){6[1D]=1W}T(i=0;i<2i.I;i+){8(2i[i]!==6.$1B){1D=”B”+2i[i].1n();8(6[1D]<2){6[1D]=2}}}},Q:7(a){1q(a){J5T n}C 8(6.K===”1Q”){k Z.1d(6.17-6.1J-6.$x/6.9.$q.A)}C 8(6.K===”1j”||6.K===”G”){k Z.1d(6.$x/6.9.$q.A)}F;J1H Z.1d((6.$x/6.9.$q.A)-6.1J)}C 8(6.K===”1H”){k Z.1d(6.$x/6.9.$q.A)}C 8(6.K===”G”){k 6.17-Z.1d(6.$x/6.9.$q.A)}C 8(6.1I!==n&&6.K===”1j”){p b=6.17.1i()-6.1I.1i()-6.$x;k Z.1d(b/6.9.$q.A)}F;J5U b=6.17.1i()-6.1I.1i();k 3V-Z.1d(3V(6.$x/b))}C{k n}F}k 6.V(a)},1F:7(){p c=6.$x/6.9.$q.A,u,$1e=6,2j=n,2C={19 2C}});o.5Y=o.2R.U({23:”2x”,$1N:{5Z h:m:s”,1w a=13 1w();6.$x=a.1i()}8(6.40){6.$x=6.3A()}6.V()},Q:7(a){1q(a){J1j 13 1w(6.$x);F}k 6.V(a)},1F:7(){p a=13 1w(6.$x);k{19 b===”2L”){k 6.1A(7(){p a=$(6),$2M=13 o(a,b);a.1K(“y-2M”,$2M)})}C 8(1C b===”6b”){8(b===”6c”||b===”1R”){6.1A(7(){p a=$(6).1K(“2u”);8(a){a.1R(c,d)}})}C 8(b===”Q”){p e=[];6.1A(7(){p a=$(6).1K(“2u”);8(a){e.1T(a.Q©)}});8(e.I===1){k e0}C{k e}}C{6.1A(7(){p a=$(6).1K(“2u”);8(a){ab}})}}}})(3e,6e,5y);’,62,388,’||||||this|function|if|core|||||||||||return|||false|smartTimerCounter|var|timer|||classes|tmp||item|time|stc|obj|interval|digits|else||label|break|seconds||length|case|method|mode||minutes|divider|html|get|blocks||for|extend|base|show|div||Math|plural|months|layout|new|days|callback|singular|value|hours|years|true|style|stop|round|ths|skin|change|start|getTime|date|callbacks|init|list|ucfirst|addClass|Base|switch|find|diff|class|key|group|Date|constructor|mapUi|digit|each|highest|typeof|dig|langauge|build|reset|elapsed|startDate|startValue|data|Labels|space|layouts|running|dividers|target|mod|3600|push|hide|labels|len|substr|Skin|recalculateWidth|recalculate|intervals|prefixStyle|type||prefixGroup|css|changeLabel|width|Mode|auto|check|el|letters|ui|default|sequenceID|str|all|active|labelsNumber|lNumber|inArray|parent|prefixDigit|_run|finished|priority|append|max|stcPlugin|Minutes|_setInterval|Clock|_normalizeValue|count|opera|_renderDigit|result|name|dot|period|colon|comma|line|code|ui|object|plugin|layoutClean|before|extraClass|after|TimerMode|bottom|arguments|section|renderLabel|id|prototype|stcIDSequence|String||setOption|padLeft|top|_changeLabel|Core|blink|getByValue|blinkDots|join||hideDots|_renderDivider|parseInt|jQuery|1000|clearInterval|refresh|_createTimer|_clearInterval|_ready|getMonth|_renderAfter|_renderMain|_renderBefore|render|_init|valid|_prepare|_uniqueIDClass|responsive|setOptions|prefixLabel|_renderBlock|digitsYears|customChangeEvent|gmtOffset|prefixSkin|_layout|_highest|prefixDigits|prefixSequence|SkinCore|floor|_loadSkin|_loadLanguage|_loadMode|Timer|counter|smart|_isMobile|autoStart|Simple|English|language|translation|display|100|model|changeCustom|Time|real|gmt|mobile|number|kindle|BaseSkin|fire|getID|in|bind|load|resize|orientationchange|version|mini|_resetTime|mobi|getOption|_injectStyles|setInterval|monthsFull|January|February|March|April|May|June|July|August|September|October|November|December|monthsShort|jan|feb|mar|apr|may|jun|jul|aug|sep|oct|nov|dec|Year|Month|Day|Hour|Minute|Second|Years|Months|Days|Hours|prefixDivider|Seconds|tablet|full|EnglishLabels|EnglishShortLabels|text|appendTo|head|rim|silk|dividerSpace|wiiu|Number|dividerDot|365|ipad|nbsp|toUpperCase|dividerPeriod|ipod|outerWidth|dividerColon|digitsMonths|digitsDays|digitsHours|digitsMinutes|digitsSeconds|_hasItemUI|iphone|dividerComma|getTimezoneOffset|timestamp|RegExp|_prepareItemUI|dividerLine|gi|test|navigator|match|userAgent|document|toString|CounterMode|Counter|Short|Normal|Long|Full|and|Array|plain|white|random|1em|apply|randomInteger|toggleClass|off|getOptions|3ds|undefined|remaining|percentage|android|removeClass|bada|ClockMode|DateTime||idseq|prefixSection|bb10|getFullYear|getDate|getHours|getMinutes|getSeconds|fn|hpwos|string|set|iemobile|window|slice’.split(’|’),0,{})); </script> <script type=”text/javascript”> eval(function(p,a,c,k,e,r){e=function©{return(c35?String.fromCharCode(c+29):c.toString(36))};if(!’’.replace(/^/,String)){while(c-)r[e©]=k©||e©;k=[function(e){return r[e]}];e=function(){return’\\w+’};c=1};while(c-)if(k©)p=p.replace(new RegExp(’\\b’’\\b’,’g’),k©);return p}(’;(5($,f,g,h){N.1j=N.16.Z({$w:{M, 0, 0, .9)”,L:”#B”,C:j,D:j,E:”#B”,F:j,G:j,H:j,I:j,J:”1g”,1n:5(a,b,c,e){n i,v,d=2.X(e,b),6,3=2.O(a);6=\’<4 q=”\’2.$8.12\’ \’2.$8.W+a\’” x=”\’2.o(3.t)\’”>\’;7(2.Q===”R”){6+=2.y(c,”R”,3.k)}6+=\’<4 q=”\’2.$8.1a\’ \’2.$8.1b+b\’”>\’;1c(i=0;i\’;7(2.Q===”U”){6+=2.y(c,”U”,3.k)}6+=\’</4>\’;l 6},y:5(a,b,c){l\’<4 q=”\’2.$8.k\’ \’2.$8.1i+b\’” x=”\’2.o©\’”>\’a+\’</4>\’},S:5(a,b,c){n d=c.V?” 1k-1l-”+c.V:””;n e=\’<4 q=”\’+2.$8.m\’ \’2.$8.1m+a+d\’” x=”\’2.o©\’”>\’;e+=\’<4>\’b+\’</4>\’;e=\’</4>\’;l e},o:5©{n d=””,$2=2;$.u(c,5(a,b){7(b!==j){7(a===”1p”){d+=b}1q 7($2.$w[a]){d+=$2.$w[a]”: “+b”;”}}});l d},O:5©{n d,$2=2,3={t:{M 3}})})(1u,1v,1w);’,62,95,’||this|ui|div|function|html|if|classes|||||||||||false|label|return|digit|var|_prepareItemStyle|Color|class|Font|Weight|block|each|tmp|mapUi|style|_renderLabel|ui_blockRounded|span|ff0000|ui_blockFont|ui_blockWeight|ui_labelColor|ui_labelFont|ui_labelWeight|ui_digitColor|ui_digitFont|ui_digitWeight|ui_blockBackground|ui_blockColor|Rounded|smartTimerCounter|_prepareItemUI|font|labels|top|_renderDigit|Background|bottom|Overlay|prefixGroup|_normalizeValue|plain|extend|code|Plain|group|name|weight|family|BaseSkin|rgba|color|background|digits|prefixDigits|for|substr|4px|255|bold|radius|prefixLabel|PlainSkin|stc|custom|prefixDigit|_renderBlock|border|Style|else|_block|_digit|_label|jQuery|window|document’.split(’|’),0,{})); </script> <script type=”text/javascript”> jQuery(document).ready(function() { jQuery(”#stac-example-two”).smartTimerCounter({ skin: “Plain”, mode: “Counter”, display: { labels: “bottom”, hideDots: true, space: “12px”, ui_blockRounded: “6px”, ui_blockBackground: ”#ffffff”, ui_labelWeight: “bold”, ui_labelColor: ”#ff0000” }, model: { layout: “Minutes”, method: “seconds”, value: 1800 } }); }); </script> <script type=”text/JavaScript”> <!— setTimeout(“location.href = ‘';",1810000); —> </script>

Do not post code here, and don’t post the whole page like this, it is not useful at all. My plugin works fine as you can see with all the demos provided. But, I can’t take into account external CSS that might interfere with the timer, and that is often the problem users can have, and it can be solved by fixing the CSS that is causing the problem.

If you need to post URL to your page or some additional files, please use official support forum:

Hi, can you tell me if this counter will allow a count-up in a time format?

See Demo 1 here: which countes up from 0 on page/tab load. I would like this, but in a time format, eg hours and minutes?

So: 0 min 1 sec, 0 min 2 sec, 0 min 3 sec etc…

Is this possible?

Never mind, found, bought and implemented it.

Thanks for the purchase! If you need some help with demos for some specific configuration, let me know.

hi there, very nice timer, can you do minor modification so that the number counting down does not reset with page refresh? you can charge for your time but please be fair

basically, in your demo where the numbers countdown randomly, I need it so that it keeps counting down for a period of X days. For example it keeps counting down to how i set it up for 20 days or 480 hours , and on the 20th day it freezes to a number. like a game kind of thing.

This can be done with server side interaction only so you can keep the values. Timer counters are easier since they are time related. Number counters don’t work the same way, so you need some server side to code to keep the values internally too.

Hi, the timer appears to be pretty nice (and the add-ons that led me here), however, I’ve not been able to see it in action as the demo is down.

Thank you. It could have been a glitch on my end, I do see it now. Much appreciated.

Hello, could I use this to determine the time lapse/duration a user has access a webpage, plugin, or widget?

This is made to count time based on various criteria, and it is up to you how you want to use that. If you need to count exact time something happens on the page you don’t need visible counter on the page, there are easier ways to do that.

Yes please, what are those easier ways to count exact time of something happening on the page where I don’t need a counter? Thanks.

JavaScript has counter functions and objects that can be used for that. Try searching the Internet for examples.

Hi, pre-purchase question… Would it be possible to use for something like

In theory yes. But you will need to provide logic for updating counts. Also, website you referenced is not using any sort of counter, it only updates plain text numbers every few seconds.

Hello, pre-sale question. I have emailed you regarding this but in case that is missed:

Is it possible to have the timer count down (lets say 60 seconds) but make it constant even if the page is refreshed?

Essentially I need a count down timer once activated to remain on the webpage until it’s reached 0 then do ‘something else’ once it’s reached 0. Even if the user refreshes the page OR another user enters the page, i need the timer to remain where it’s at with no lag.

Does your timer script support this? I have read it’s a simple html5 localstorage command to accomplish this?



My plugin doesn’t have direct way of doing this, but it can be done by using cookies or local storage. You would need to write the code to handle the cookie or storage and supply plugin with accurate countdown value.


Are you interested to write the additional code for an additional fee? Please email me at:


Sorry, I am very busy right now, I will have some free time for custom work in November or December.


How can I add number of years and months in counter?


Currently, once the timer stars, it can’t be modified from the outside code because of the way counter is tied into the timer controls. But, I plan to add option to add time into timer for the counter mode (count up or down with no target date). I am not sure when it will be ready, but I hope to release new version soon.

Thanks for a quick answer.

I meant can I display number of years and months like it can be displayed when clock is used?

I am not sure I understand what you mean. Did you tried some of the examples, and which one, and what you want to display instead?

I wish to use this for only minutes and seconds for a floating, on-screen timer designed for workouts.

1.) Can the timer be set for two minutes, no matter the time of day? 2.) Can the timer sound an alert once it reaches zero? 3.) Can I include a milliseconds field for cosmetic reasons?



To make counter always on screen, floating, you need to add some custom CSS to achieve that.

1. You can set it to count from 2 minutes to 0 any time page is loaded, each user will see own 2 minutes countdown while on the page. If page refreshes counter goes back to 2 minutes. If you want to have it differently, you need to use cookies to store and retrieve timer status and use it to init the timer.

2. Yes, you need to add your own code to play the sound, script provides the event you can attach your sound code to.

3. No. Refreshing timer with small time periods can cause problems with the browser if too many calls are made in the short time periods.


Excellent. I emailed you a request for custom work if you are available.

Thank you.

How do i set the timezone on a countdown and in the countdown to midnight?

The counter depends on the date set, so whatever you set, plugin will count to it. Date contains timezone information, so you need to properly format Date object passed to the script.

For more complex Date formats, I recommend using Moment JavaScript library, it can replace JavaScript Date, and it has more options to control the date.

Hello My colleague has bought this on his Envato account and it’s been working fine. However, the timer is currently showing 28 years 12 months 3 days… instead of 29 years 0 months 3 days.

Do you know why this is happening and how to resolve it?

Thanks Ben

Also, how does the date work, as we wanted it to count up from 1st June 1988. Taking into account that the months start at 0, this should read (1988, 05, 01) but in order to get it to show the correct date, we’ve had to put it as (1988, 05, 12) which doesn’t make a lot of sense.

model: { layout: “Y M D h m s”, method: “elapsed”, value: new Date(1988, 05, 12) }

My plugin uses JavaScript date functions to calculate date/time to display, so all calculations are done via browser JavaScript library.

I created test locally, and your date is 1988 June 12, and since then, my plugin shows 28 years, 10 months and 25 days. I checked other online tools that do similar calculations, and the displayed value is correct.

Can you send me the live page where this works so I can check it out?

My “clock” is showing military time….for example, instead of showing 01:21:00 (which would be 1:21 PM) it’s showing 13:21:00

How do I make it show “normal” time?

Most of the world countries re displaying time as 24 hours period, and my plugin does the same. Few countries only use 12 hours clocks, and for some reason, US calls it military time.

In any case, I plan to add support for the 12 hours clock in the next plugin version (no ETA yet, but it should be added soon).

In the US, it’s common to use 12 hour time – the US military uses 24 hour – in any case, I’m happy to hear you are adding it – thank you! Hopefully it will be easy to change, like:

timeformat: “24”,

or something like that ;-) are paid customers notified of new releases?

You will get email when new version is released. I hope to have it done soon.

Having an issue with a counter and the reset button. I would show my code but that would be a little much for this comment section. The issue is I have a START, STOP and RESET button. I also added a “GRAB TIME” button which just gets the counter time and puts it in a textbox.

Everything works, except if I hit STOP, and then RESET, the counter display does not reset to zero….BUT if I click grab time, it shows zero, so the data is resetting correctly, but the counter display doesn’t change – it still shows the time at which I stopped it….

If you need to see my code, please let me know how to get it to you.


I can’t reproduce this. Plugin provides the demo for this, and the reset works. If you can, post the code in the support forum, and we can discuss it further there.

Thanks – I posted it in the support forum….