https://lophocvitinh.vn/ci/assets/js/counter.js

1// Xu ly COUNTER
2//https://easings.net
3//tu khoa "Hiệu ứng số tăng dần JS"
4function easeOutExpo(x) {
5  return x === 1 ? 1 : 1 - Math.pow(2, -10 * x);
6}
7
8function animateNumber(finalNumber, duration = 5000, startNumber = 0, callback) {
9  const startTime = performance.now()
10  function updateNumber(currentTime) {
11    const elapsedTime = currentTime - startTime
12    if (elapsedTime > duration) {
13      callback(finalNumber)
14    } else {
15      const timeRate = (1.0 * elapsedTime) / duration
16      const numberRate = easeOutExpo(timeRate)
17      const currentNumber = Math.round(numberRate * finalNumber)
18      callback(currentNumber)
19      requestAnimationFrame(updateNumber)
20    }
21  }
22  requestAnimationFrame(updateNumber)
23}
24
25
26//khi cuộn chuột xuống cuối trang mới thực thi
27$(window).scroll(function() {
28      if($(window).scrollTop() + $(window).height() > $(document).height() - 100) {
29	  	const hitCounter = document.getElementById("hit-counter");
30
31		const count = Number(hitCounter.dataset.count);
32		  
33        animateNumber(count, 3000, 0, function (number) {
34            const formattedNumber = number.toLocaleString()
35            document.getElementById('hit-counter').innerText = formattedNumber
36        })
37          
38          
39        animateNumber(41, 3000, 0, function (number) {
40            const formattedNumber = number.toLocaleString()
41            document.getElementById('like-counter').innerText = formattedNumber
42        })
43          
44        animateNumber(2016, 3000, 0, function (number) {
45            const formattedNumber = number.toLocaleString()
46            document.getElementById('year-counter').innerText = formattedNumber
47        })
48      }
49});