FlipClock 重置倒计时
FlipClock reset countdown
我正在使用 FlipClock.js 开发一个从 1:00 分钟到 0 的简单倒数计时器,我的问题是,它直到 0 才开始计数,然后当它重置时,它开始于00:59 应该是 1:00。我不知道为什么,但在 00:59 之后变成 00:00 然后 00:58。
我尝试使用 setTime()
但没有成功。
希望你能理解我。
谢谢
JS
var clock = $('.my-clock').FlipClock(60, {
countdown: true,
callbacks: {
stop: function() {
clock.reset();
clock.start();
}
}
});
希望对您有所帮助。
var clock;
$(document).ready(function() {
clock = $('.my-clock').FlipClock(60, {
countdown: true,
callbacks: {
stop: function() {
setTimeout(function(){
clock.reset();
clock.setTime(60);
clock.start();
},1000)
}
}
});
});
var clock;
$(document).ready(function() {
clock = $('.my-clock').FlipClock(10, {
countdown: true,
callbacks: {
stop: function() {
setTimeout(function(){
clock.reset();
clock.setTime(10);
clock.start();
},1000)
}
}
});
});
.my-clock {
text-align:center;
width:auto;
display: inline-block;
}
.center {
text-align:center;
}
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/flipclock/0.7.8/flipclock.css"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/flipclock/0.7.8/flipclock.min.js"></script>
hey
<div class="center">
<div class="my-clock"></div>
</div>
我正在使用 FlipClock.js 开发一个从 1:00 分钟到 0 的简单倒数计时器,我的问题是,它直到 0 才开始计数,然后当它重置时,它开始于00:59 应该是 1:00。我不知道为什么,但在 00:59 之后变成 00:00 然后 00:58。
我尝试使用 setTime()
但没有成功。
希望你能理解我。
谢谢
JS
var clock = $('.my-clock').FlipClock(60, {
countdown: true,
callbacks: {
stop: function() {
clock.reset();
clock.start();
}
}
});
希望对您有所帮助。
var clock;
$(document).ready(function() {
clock = $('.my-clock').FlipClock(60, {
countdown: true,
callbacks: {
stop: function() {
setTimeout(function(){
clock.reset();
clock.setTime(60);
clock.start();
},1000)
}
}
});
});
var clock;
$(document).ready(function() {
clock = $('.my-clock').FlipClock(10, {
countdown: true,
callbacks: {
stop: function() {
setTimeout(function(){
clock.reset();
clock.setTime(10);
clock.start();
},1000)
}
}
});
});
.my-clock {
text-align:center;
width:auto;
display: inline-block;
}
.center {
text-align:center;
}
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/flipclock/0.7.8/flipclock.css"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/flipclock/0.7.8/flipclock.min.js"></script>
hey
<div class="center">
<div class="my-clock"></div>
</div>