Javascript
[Javascript] 카운팅 숫자 효과
- 2026.07.01 10:42:56
|
[!]Javascript[/!]
////////////////////
// 카운팅 //////////////////// // 숫자 초기화 document.querySelectorAll('.m1 .won .num').forEach((el) => { el.dataset.num = (el.textContent || '0').replace(/,/g, '').trim(); el.textContent = '0'; }); // timeline m1_tl = gsap.timeline({ 'scrollTrigger' : { 'trigger' : '.m1 .won', 'start' : 'top 85%', 'end' : "bottom bottom", 'toggleActions' :'play none none reverse' } }); // 카운팅 추가 document.querySelectorAll('.m1 .won .num').forEach((el, index) => { const obj = { val: 0 }; const endValue = parseInt(el.dataset.num, 10) || 0; m1_tl.to(obj, { val: endValue, duration: 1.5, ease: 'power1.out', snap: { val: 1 }, onUpdate: function () { el.textContent = obj.val.toLocaleString(); } }, index === 0 ? '-=.2' : '<'); }); |
