Доброго времени суток.
В JS я не силен, поэтому появилась необходимость вашей помощи.
Есть countdown-таймер JS на 5 сек., который запускается по кнопке.
Все работает, но вот только при обновлении страницы таймер сбрасывается на исходное значение.
В связи с этим вопрос:
Каким образом заставить счетчик продолжать свою работу заданное время при обновлении страницы?
И за ним появляется второй вопрос:
Как разместить этот таймер в количестве больше трех штук на одной странице?
Код таймера(timer.js):
$(document).ready(function(){
var shortly = 0;
$('#expireMessage').countdown({until: shortly,
expiryText: '<div class="over">Время вышло!</div>'});
$('#expireMessageStart').click(function() {
shortly = new Date();
shortly.setSeconds(shortly.getSeconds() + 5.5);
$('#expireMessage').countdown('option', {until: shortly});
});
});
Код HTML страницы:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title>jQuery Countdown</title>
<link rel="stylesheet" type="text/css" href="css/jquery.countdown.css">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery/jquery.plugin.js"></script>
<script type="text/javascript" src="js/jquery/jquery.countdown.js"></script>
<script type="text/javascript" src="js/jquery/timer.js"></script>
</head>
<body>
<h2>Чтобы не записывать никуда и проще считать сколько осталось времени.</h2>
<div id="expireMessage"></div>
<button type="button" id="expireMessageStart">Start</button>
</body>
</html>
Таймер взят с
Keith Wood. Callbacks, третий.