Есть тег span со значением 15, как через некие интервалы времени уменьшать это значение, то есть 15, 14, 13, 12, 11.... Использовать метод setInterval, но как уменьшать значение?
var interval = setInterval(function () {
var span = document.querySelector("span")
if (!--span.textContent) {
clearInterval(interval)
}
}, 1000)
<span>15</span>
var span = document.querySelector(".bonus");
span.innerText = (+span.innerText) - 1;
Всё становится лучше с jQuery ;)
$.fn.countdown = function(start, period = 1000) {
this.text(start);
var t = setInterval(() => this.text() == 1 ? clearInterval(t) : this.text(this.text()-1), period);
};
$('.bonus').countdown(15);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span class=bonus>Счётчик</span>
Почти то же самое на vanillaJs:
function Countdown(selector) {
var el = document.querySelector(selector), t;
this.start = start;
function start(from, interval = 1000, to = 1) {
el.textContent = from; // Инициализация
if (t) clearInterval(t); // На случай повторного запуска
t = setInterval(tick.bind(null, to), interval);
}
function tick(to) {
if (!t) return;
if (el.textContent == to) {
clearInterval(t); // Остановка таймера
t = null;
} else {
el.textContent--; // Собственно, уменьшение
}
};
}
new Countdown('.bonus').start(15, 500);
<span class=bonus>Счётчик</span>
Вот js для смены класса про скролле
Мне нужно, чтобы при добавление фотографии, отображалось сразу же фотография которую добавилиТо есть добавили одну фотографию, она отобразилась,...