I'm trying to create a regressive product counter with javascript.
- Starting with a number that I determine. Ex .: 357
- After a few seconds. Ex: 2s
- This value decreases randomly. Ex .: 159, 78, 25
- I want to put it inside a class.
- Do this function three times on the screen.
- When it reaches zero, it blocks a specific button.
Would it be possible to do this with javascript?
Ex:
$(".date").html( moment().format('DD/MM/YYYY') );
var inicio_5 = 337;
var inicio_3 = 494;
var inicio_1 = 150; //327
var inicio_5_var = 13;
var inicio_3_var = 22;
var inicio_1_var = 16;
var hora = moment().format('h');
inicio_5 = inicio_5 - (hora*inicio_5_var);
inicio_3 = inicio_3 - (hora*inicio_3_var);
inicio_1 = inicio_1 - (hora*inicio_1_var);
$(".pacotes_disponiveis_5").html(inicio_5);
$(".pacotes_disponiveis_3").html(inicio_3);
$(".pacotes_disponiveis_1").html(inicio_1);
(function(){
var counter = inicio_5;
setInterval(function() {
valor = Math.floor((Math.random() * 3) + 1);
counter = counter-valor;
if (counter >= 0) {
$(".pacotes_disponiveis_5").html(counter).hide().show('slow');
}
if (counter <= 14) {
$(".pacotes_disponiveis_5").html(14);
clearInterval(counter);
}
}, 5000);
})();
(function(){
var counter = inicio_3;
setInterval(function() {
valor = Math.floor((Math.random() * 3) + 1);
counter = counter-valor;
if (counter >= 0) {
$(".pacotes_disponiveis_3").html(counter).hide().show('slow');
}
if (counter <= 9) {
$(".pacotes_disponiveis_3").html(9);
clearInterval(counter);
}
}, 4000);
})();
(function(){
var counter = inicio_1;
setInterval(function() {
valor = Math.floor((Math.random() * 5) + 1);
counter = counter-valor;
if (counter >= 0) {
$(".pacotes_disponiveis_1").html(counter).hide().show('slow');
}
if (counter <= 0) {
clearInterval(0);
$(".pacotes_disponiveis_1").html('0');
$(".pacote_1 .utm span").html('ESGOTADO');
$(".pacote_1 .utm").attr('href','#').attr('disabled',"disabled").addClass('btn-red');
$(".pacote_1 .pacotes-disponiveis").attr('href','#').attr('disabled',"disabled").addClass('btn-red');
clearInterval(counter);
}
}, 3000);
})();