explosion
This commit is contained in:
68
script.js
68
script.js
@@ -1056,6 +1056,11 @@
|
||||
var numbers = document.querySelectorAll('.stat .number[data-target]');
|
||||
numbers.forEach(function(el) {
|
||||
var target = parseInt(el.getAttribute('data-target'));
|
||||
var randMax = parseInt(el.getAttribute('data-target-max'));
|
||||
if (randMax) {
|
||||
var randMin = parseInt(el.getAttribute('data-target-min')) || 0;
|
||||
target = randMin + Math.floor(Math.random() * (randMax - randMin + 1));
|
||||
}
|
||||
var suffix = el.getAttribute('data-suffix') || '';
|
||||
var current = 0;
|
||||
if (target <= 0) return;
|
||||
@@ -1070,7 +1075,70 @@
|
||||
current = target;
|
||||
clearInterval(timer);
|
||||
if (final) {
|
||||
var digits = el.textContent.replace(/[^0-9]/g, '').split('');
|
||||
if (digits.length === 0) digits = ['0'];
|
||||
var rect = el.getBoundingClientRect();
|
||||
var fontSize = parseInt(window.getComputedStyle(el).fontSize);
|
||||
var charW = rect.width / digits.length;
|
||||
var frags = [];
|
||||
el.style.opacity = '0';
|
||||
for (var d = 0; d < digits.length; d++) {
|
||||
var frag = document.createElement('div');
|
||||
frag.className = 'fragment';
|
||||
frag.textContent = digits[d];
|
||||
var dx = rect.left + d * charW + charW / 2;
|
||||
var dy = rect.top + rect.height / 2;
|
||||
var angle = Math.random() * Math.PI * 2;
|
||||
var speed = 3 + Math.random() * 8;
|
||||
frag.style.cssText = 'position:fixed;left:' + dx + 'px;top:' + dy + 'px;font-size:' + fontSize + 'px;font-weight:900;color:#f5a623;font-family:Inter,system-ui,sans-serif;pointer-events:none;z-index:999;opacity:1;transform:translate(-50%,-50%);text-shadow:0 0 20px rgba(245,166,35,0.5);';
|
||||
document.body.appendChild(frag);
|
||||
frags.push({
|
||||
el: frag,
|
||||
x: dx,
|
||||
y: dy,
|
||||
vx: Math.cos(angle) * speed + (Math.random() - 0.5) * 3,
|
||||
vy: Math.sin(angle) * speed - 6,
|
||||
rot: 0,
|
||||
rotSpeed: (Math.random() - 0.5) * 30,
|
||||
});
|
||||
}
|
||||
var gravity = 0.35;
|
||||
var running = true;
|
||||
var startTime = Date.now();
|
||||
function animateFrags() {
|
||||
if (!running) return;
|
||||
var alive = false;
|
||||
var elapsed = Date.now() - startTime;
|
||||
for (var k = 0; k < frags.length; k++) {
|
||||
var f = frags[k];
|
||||
f.vy += gravity;
|
||||
f.x += f.vx;
|
||||
f.y += f.vy;
|
||||
f.rot += f.rotSpeed;
|
||||
f.vx *= 0.99;
|
||||
var alpha = Math.max(0, 1 - elapsed / 2500);
|
||||
f.el.style.left = f.x + 'px';
|
||||
f.el.style.top = f.y + 'px';
|
||||
f.el.style.transform = 'translate(-50%,-50%) rotate(' + f.rot + 'deg)';
|
||||
f.el.style.opacity = alpha;
|
||||
if (alpha > 0 && f.y < window.innerHeight + 200) {
|
||||
alive = true;
|
||||
}
|
||||
}
|
||||
if (alive) {
|
||||
requestAnimationFrame(animateFrags);
|
||||
}
|
||||
}
|
||||
animateFrags();
|
||||
el.textContent = final;
|
||||
el.style.opacity = '';
|
||||
el.classList.add('fade-in-final');
|
||||
setTimeout(function() {
|
||||
running = false;
|
||||
for (var j = 0; j < frags.length; j++) {
|
||||
frags[j].el.remove();
|
||||
}
|
||||
}, 2500);
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user