Question

i'm using a jQuery countdown plugin (can be downloaded here: http://keith-wood.name/countdown.html).

I've implemented it and it works when there is a single instance (countdown) on a page, but when there are more than 1 instances, it doesn't work.

The code i'm using:

<div id="defaultCountdown"></div>

<script type="text/javascript">
jQuery(function () {
    var austDay = new Date();
    // Set some date in the past. In this case, it's always been since Jan 1
    var offerEndDateTS =  <?php echo get_post_meta($post->ID, '_sale_price_dates_to', true); ?>;
    var offerEndDate = new Date(offerEndDateTS * 1000);
    austDay = new Date(offerEndDateTS * 1000);
    jQuery('#defaultCountdown').countdown({until: austDay});
    jQuery('#year').text(austDay.getFullYear());

});
</script>

Any ideas on how to make all counters on same page to work? Thanks for your time

Was it helpful?

Solution 2

It seems to work fine::

<div id="defaultCountdown"></div> //first
<div id="defaultCountdownSecond"></div> //second

<div id='featured_offer_countdown_template'>

     {d<}<div class='item days'>
        <span class='value'>{dn}</span>
       <span class='label'>{dl}</span>
     </div>{d>}          
    <div class='item hours'>
       <span class='value'>{hn}</span>
       <span class='label'>{hl}</span>
    </div>
    <div class='item minutes'>
       <span class='value'>{mn}</span>
        <span class='label'>{ml}</span>
    </div>
    <div class='item seconds'>
       <span class='value'>{sn}</span>
       <span class='label'>{sl}</span>
   </div>
</div>

js code:

var austDay = new Date();
austDay = new Date(austDay.getFullYear(), 5, 9);
$('#defaultCountdown').countdown({
    until: austDay,
    format: 'dHMS'    
});
$('#defaultCountdownSecond').countdown({
    until: austDay,
    format: 'dHMS'    
});
$('#year').text(austDay.getFullYear());

Demo:: jsFiddle

OTHER TIPS

Did you try reading the reference documentation or looking at the demos??

Seems to work fine for me:

HTML

<div id="defaultCountdown"></div>
<div id="defaultCountdown2"></div>

JavaScript:

$('#defaultCountdown').countdown({until: new Date(2014, 1, 1)});
$('#defaultCountdown2').countdown({until: new Date(2015, 7, 1)});

jsFiddle Demo

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top