я хотел бы показать обратный отсчет в часах: минуты: секунды до времени закрытия (если открыто) или до времени открытия (на следующий день при закрытии). Как это сделать в html?
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>countdown</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-countdown/2.0.2/jquery.plugin.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-countdown/2.0.2/jquery.countdown.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.15.1/moment.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-countdown/2.0.2/jquery.countdown.css" />
<style type="text/css">
#countdownText span
{
display: none;
}
#countdownText.opened .close, #countdownText.closed .open
{
display: inline;
}
</style>
<script type="text/javascript">
$(function () {
var $timer = $('#timer');
var $countdownText = $('#countdownText');
var now = moment();
var openingToday = moment({hour: 8});
var closingTime = moment({ hour: 17});
var openingTime = moment({ year: now.year(), month: now.month(), date: now.date() + 1, hour: 8 });
if(now.diff(openingToday) < 0)
{
$timer.countdown({
until: openingToday._d
});
$countdownText.addClass('closed');
}
else if (now.diff(closingTime) < 0)
{
$timer.countdown({
until: closingTime._d
});
$countdownText.addClass('opened');
}
else
{
$timer.countdown({
until: openingTime._d
});
$countdownText.addClass('closed');
}
});
</script>
</head>
<body>
<div id="countdownText">
<span class="open">Opening in</span>
<span class="close">Closing in</span>
</div>
<div id="timer"></div>
</body>
</html>