Release date: 15.01.2015r.
Description: Plugin kk countdown counts down to specific dates in the future.
[x_button shape=”square” size=”regular” float=”none” href=”http://kkblog-old.dev/demo-plugins/jquery-kkcountdown/” target=”blank” info=”none” info_place=”top” info_trigger=”hover” class=”x-btn-gray”]DEMO[/x_button] [x_button shape=”square” size=”regular” float=”none” href=”https://github.com/KrzysiekF/kkcountdown” target=”blank” info=”none” info_place=”top” info_trigger=”hover”]DOWNLOAD[/x_button] [x_button shape=”square” size=”regular” float=”none” href=”https://github.com/KrzysiekF/kkcountdown/issues” target=”blank” info=”none” info_place=”top” info_trigger=”hover” class=”x-btn-gray”]Support / Bug report / Suggestions[/x_button]
Install KK Countdown:
1. In a page header following files should be included:
- jQuery – download HERE
- plugin – kkcountdown.min.js
2. Once a webpage is uploaded, we launch plugin countdown with the below code:
3. Next, we need to place tag which consists of at least two below mentioned attributes:
- class – kkcount-down
- data-time – in this case the value indicates the date. This attribute needs to be expressed in digits only. You can use this time converter.
- or data-seconds – in this case the value indicates number of seconds to countdown
<span class="kkcountdown" data-time="1420066800"></span>
<span class="kkcountdown" data-seconds="60"></span>
This tag can be put in a random place on the webpage.
dayText :: [ ‚day’ ]
Text displayed after certain number of days included in countdown (when number days = 1)
daysText :: [ ‚days’ ]
Text displayed after certain number of days included in countdown
hoursText :: [ ‚:’ ]
Text displayed after certain number of hours included in countdown
minutesText :: [ ‚:’ ]
Text displayed after certain number of minutes included in countdown
secondsText :: [ null ]
Text displayed after certain number of seconds included in countdown
oneDayClass :: [ false ]
Class will be added if there is less than 24 hours untill the end of countdown
textAfterCount :: [ ‚—‚ ]
Text is displayed after the countdown is over (quantity is not take into consideration if it is set up as ‚callback’ option)
displayDays :: [ true ]
Displaying the number of days remaining till the end of countdown: true– the number of days is displayed, false– the number of days is not displayed
displayZeroDays :: [ true ]
Displaying the number of days when number of days is 0.
addClass :: [ null ]
Adding a class to markers indicating countdown (e.g. indicated the name of call e.g. ‚class-name’)
callback :: [ null ]
Indicate the name of fucntion which should be launched after the end of countdown
- NEW: Rewrite plugin code
- NEW: New DEMO site
- countdown time more flexible and standards-based // thanks for Russell Todd
- add THIS object to callback function // thanks for peterpeshev
- Improvements for usage in Ukraine and Russia // thanks for knowgod
- NEW: GITHUB repository
- NEW: Plugin code has been rewritten. This will allow you add new options.
- NEW: You can define text after the number of hours, minutes and seconds.
- NEW: You can turn off the number of days, if the number of days is zero.
- CHANGE: Instead, define the text color of the countdown, when the countdown to the end left less than 24 hours, we define a class.
- NEW: Function added allows to adjust the settings.
- CHANGE: Minor changes have been made in the script which protect against conflicts with other page elements.
- CHANGE: Improved countdown script which is more efficient and works much faster.
- CHANGE: Change of the atribute needed for the script to work properly. Instead of ID we should not use only appropriate class.
v 1.0 BETA:
- NEW: possibility to add as many dates as you wish till which time will be counted
- NEW: If there are less than 24 hours left to a particular day, digits will start glowing in red