Utilizamos cookies para ajudar você a navegar com eficiência e executar certas funções. Você encontrará informações detalhadas sobre todos os cookies sob cada categoria de consentimento abaixo.
Os cookies que são classificados com a marcação “Necessário” são armazenados em seu navegador, pois são essenciais para possibilitar o uso de funcionalidades básicas do site....
Os cookies necessários são cruciais para as funções básicas do site e o site não funcionará como pretendido sem eles.
Esses cookies não armazenam nenhum dado pessoalmente identificável.
Cookies funcionais ajudam a executar certas funcionalidades, como compartilhar o conteúdo do site em plataformas de mídia social, coletar feedbacks e outros recursos de terceiros.
Cookies analíticos são usados para entender como os visitantes interagem com o site. Esses cookies ajudam a fornecer informações sobre métricas o número de visitantes, taxa de rejeição, fonte de tráfego, etc.
Os cookies de desempenho são usados para entender e analisar os principais índices de desempenho do site, o que ajuda a oferecer uma melhor experiência do usuário para os visitantes.
Os cookies de anúncios são usados para entregar aos visitantes anúncios personalizados com base nas páginas que visitaram antes e analisar a eficácia da campanha publicitária.
Para colocar um contador animado iremos utilizar o HTML com JavaScript, lembrando que depois você poderá estilizar do jeito desejado.
<!-- HTML -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div><span class="counter-up" data-count-to="5684"></span>,<span class="counter-up" data-count-to="51"></span></div>
<div><span class="counter-up" data-count-to="6603146"></span></div>
<div><span class="counter-up" data-count-to="20362"></span></div>
<!-- JavaScript -->
<script type="text/javascript">
const tempo_intervalo = 5;
const tempo = 4000;
$('.counter-up').each(function() {
let contar_ate = parseInt($(this).data('countTo'));
let intervalos = tempo / tempo_intervalo;
let incremento = contar_ate / intervalos;
let valor = 0;
let el = $(this);
let timer = setInterval(function() {
if (valor >= contar_ate){
valor = contar_ate;
clearInterval(timer);
}
let texto = valor.toFixed(0).toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, "$1.");
el.text(texto);
valor += incremento;
}, tempo_intervalo);
});
</script>