Hi,
I'm trying to create a 7 day count down in adobe edge animate. which should include days, hours and minutes like in the picture below.
I'm seriously struggling and I am a super noob at anything that involves coding.
Waiting in anticipation.
You can use existing jquery plugin from here http://plugins.jquery.com/tag/countdown/
Download any of the plugins as per your need, and add the script to the Edge Animate by clicking "Add Script" and start using it in compositionReady of the stage.
Before adding this downloaded script file in Edge Animate, you have to add the jQuery script file, else countdown plugin won't work.
This will reduce the amount of coding you otherwise have to do if you implement it using plain javascript.
hth,
Vivekuma
Hi Vivekuma,
Thanks for the reply. I have attempted it but I have no idea what I am doing. It doesn't work because I'm not doing it right.
Is there a simple edge animate project that has a countdown?
Many thanks,
Pawan
Here is a sample I made using code from javascript kit. Pretty simple. Create a symbol with a text field named 'count'. On frame one add the code for countdown and on a frame to the right sym.play(0); This will loop back to the code on frame 1.
I also completed a simple sample so thought of sharing anyway You should also be able to find other posts from resdesign on how to load and use jquery plugins in case you need to.
Here is the link for the composition - Dropbox - simplecountdown.zip . Solution is based on this simple javascript code - Edit fiddle - JSFiddle
You can see it working here - Simple Counter
wow! Thank you sooo much! thank you for taking your time to help a clueless person like me. I'm really glad. thanks again!
This is wonderful! thank you very much. your example it perfect! One last question, how would I be able to set the count down time I want? so lets say 6days 4 hours 3 minutes?
Thank you ever so much again!!!
The code behind my solution was very similar to what resdesign had suggested in her sample. You can open the stage compositionReady handler and search for the following:
//Change this as per your requirement
var until = new Date((new Date()).getTime() + 42424200);
You can change that to:
//6 days, 4 hours, 3 mins from now
var until = new Date((new Date()).getTime() + 6 * 86400000 + 4 * 3600000 + 3 * 60000);
It will also be a good idea to convert the top level div to a symbol. You can cut the entire code of compositionReady and move it to the new symbol's creationComplete handler. Then you should be able to use the symbol whereever you want.
-Dharmendra
Wonderful! Thanks again for following me through. One last question. The problem is when ever I refresh or when ever someone visits the site, the clock starts from the assigned point for example 6d 4h 3min.So how can I make it countdown to 0 without it depending on the individual viewer. So if I upload the site today, the countdown should finish in 6 days no matter where I view it from. Is this possible?
here is a example of what I mean: example
many thanks again!!!
You should use a fixed date for the count down. You can use the following API:
new Date(Date.UTC(year, month, day, hour, minute, second))
Check the documentation page for reference - Date.UTC() - JavaScript | MDN
For eg:
var until = new Date(Date.UTC(2014, 11, 6, 12, 6, 7));
Thank you ever so much. Everything is working perfectly fine now. thank you for understanding the situation and giving a solution to it.