Всем привет, есть скрипт таймера запускающегося по нажатию на кнопку, сейчас есть три кнопки, но переменная для обратного отсчета секунд используется одна, как сделать так что бы на каждую кнопку можно было назначить любое количество секунд? Заранее огромное спасибо.
Вот сам код.
Результат должен быть таким же как на этом сайте.
http://www.favoritefaucets.com/
готов заплатить за готовый полностью код, который смогу разместить на своем сайте.
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.time, input {
background: rgba(255, 55, 251, 1);
width: 80px;
height: 30px;
display: block;
text-align: center;
}
.div {
border: 1px #666 solid;
margin:2px;
}
</style>
<script>
function countdownTime(elem) {
var bet_time = new Date;
bet_time = bet_time.getTime() + 20000;
window.clearTimeout(elem.timer)
function calculate(elem) {
var now_time = new Date;
now_time = now_time.getTime();
var seconds = Math.ceil((bet_time - now_time) / 1000 * 1);
if (seconds > 0) {
residue = seconds < 10 ? "0" + seconds : seconds;
elem.innerHTML = "00:00:" + residue;
elem.timer = setTimeout(function () {
calculate(elem);
}, 1000);
} else {
elem.innerHTML = "активен";
}
}
calculate(elem);
}
function clickTimerButton(elem) {
return countdownTime(elem);
}
function clickTimerButton(elem) {
return countdownTime(elem);
}
window.onload = function () {
var divs = document.querySelectorAll('.div');
for (var i = 0; i < divs.length; i++) {
var el = divs[i].querySelector('.time');
var button = divs[i].querySelector('button');
button.onclick = (function (span) {
return function () {
clickTimerButton(span)
}
})(el);
button.click()
}
}
</script>
</head>
<body>
<div class='div'>
<div><span class='time'></span></div>
<div><button>запуск</button></div>
</div>
<div class='div'>
<div><span class='time'></span></div>
<div><button>запуск</button></div>
</div>
<div class='div'>
<div><span class='time'></span></div>
<div><button>запуск</button></div>
</div>
</body>
</html>