CODEWITHSUNDEEP
javascriptjqueryflipclock
user3788671
user3788671

Reputation: 2057

Flipclock.js interval callback method that fires an event every minute

I added a flipclock countdown timer to my site and I want a way to fire an event every minute so that I can make a change to an element in the source. I tried adding an alert in the code to see if the callback ever gets fired but I am pretty sure I do not quite understand the documentation of the callback method. I referenced the flipclock.min.js and the flipclock.css and I am able to get the clock to countdown and everything i just need to have an event fire after every minute. This is where you can find the documentation and the download: Flipclock.js

This is the javascript code that i currently have:

<script type="text/javascript">
    var clock = $('#clock').FlipClock(3600,{
        countdown: true,
        callbacks: {
            _interval: function () {
                var time = clock.getTime().time;
                alert(time);
                if (time % 60 == 0) {
                    //Change element
                }
            }
        }
    });

</script>

Here is the html:

<div id="clock-container"style="width: 100%">
    <div class="col-lg-6" id="clock"></div>
</div>

Upvotes: 2

Views: 5747

Answers (1)

ventaur
ventaur

Reputation: 1851

The underscore prefix of your interval callback name is reserved for the global Timer object. In your use case, you should just use "interval". You'll also want to disable the auto start feature, so your clock variable gets assigned to before the first interval callback is called (thus avoiding clock being undefined).

var clock = $('#clock').FlipClock(3600,{
    autoStart: false,
    countdown: true,
    callbacks: {
        interval: function () {
            var time = clock.getTime().time;
            alert(time);
            if (time % 60 == 0) {
                //Change element
            }
        }
    }
});

clock.start();

Upvotes: 5

Related Questions