Create A Sweet Pregnancy Countdown Ticker with jQuery Tictic Plugin

Tictic is a jQuery plugin that creates a stylish, circular, sweet event ticker to count down the days till your pregnancy. Requires easy pie chart plugin to draw an animated countdown timer.

How to use it:

1. Include jQuery library together with the jQuery tictic and easy pie chart plugins at the bottom of the document.

<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="easypiechart/jquery.easypiechart.min.js"></script>
<script src="tictic/jquery.tictic.min.js"></script>

2. Create an empty DIV element for the pregnancy ticker.

<div class="counter"></div>

3. Check document is ready, then call the plugin on the DIV element you just created and set the target date.

$(document).ready(function () {

var $defaulteCounter = $(".counter");

if ($defaulteCounter.length) {
  $defaulteCounter.tictic({
    date: {
    year: 2014,
    month: 4,
    day: 29
    },
    charts: {
      disableAnimation: false
      }
    });
  }
});

4. All the available options.

totalWeeks: 40,
date: {
  year: 2014,
  month: 4,
  day: 29
},
charts: {
  disableAnimation: false,
  darkerColor: '#F57E9F', //#598DCC
  lighterColor: '#FFC1D4', //#83B7EF
  size: 200,
  bigchart: {
    scaleColor: false,
    lineCap: 'square',
    lineWidth: 10
  },
  smallchart: {
    scaleColor: false,
    lineCap: 'square',
    lineWidth: 3
  }
},
heart: {
  src: 'js/heart.png'
}

About Author:

Author: Issa Qandil

Website: https://github.com/Qandil/tictic

---

This awesome jQuery plugin is developed by Qandil. For more Advanced Usages, please check the demo page or visit the official website.