我借助copilot帮忙改进了一下,可以实现每年的固定日期触发,其余日期不触发,以满足在周年庆自动触发的需求~
<script src="https://cdn.jsdelivr.net/npm/canvas-confetti@1.9.3/dist/confetti.browser.min.js"></script>
<script>
function isSpecificDate(month, day) {
var today = new Date();
return today.getMonth() === month && today.getDate() === day;
}
if (window.location.pathname == "/" && isSpecificDate(7, 7)) { // 第一个数从0起计,即如希望是12月则填11即可!
var end = Date.now() + (5 * 1000);
(function frame() {
confetti({
particleCount: 2,
angle: 60,
spread: 55,
origin: { x: 0 }
});
confetti({
particleCount: 2,
angle: 120,
spread: 55,
origin: { x: 1 }
});
if (Date.now() < end) {
requestAnimationFrame(frame);
}
}());
var duration = 6 * 1000;
var animationEnd = Date.now() + duration;
var defaults = { startVelocity: 30, spread: 360, ticks: 160, zIndex: 0 };
function randomInRange(min, max) {
return Math.random() * (max - min) + min;
}
var interval = setInterval(function() {
var timeLeft = animationEnd - Date.now();
if (timeLeft <= 0) {
return clearInterval(interval);
}
var particleCount = 50 * (timeLeft / duration);
// since particles fall down, start a bit higher than random
confetti({ ...defaults, particleCount, origin: { x: randomInRange(0.1, 0.3), y: Math.random() - 0.2 } });
confetti({ ...defaults, particleCount, origin: { x: randomInRange(0.7, 0.9), y: Math.random() - 0.2 } });
}, 250);
}
</script>