Files
blog/src/components/widget/EmojiCursor.astro
lirui b6abc32784 feat(ui): 实现ACG风格UI改造和动画效果
添加樱花飘落和表情点击特效组件,优化卡片动画和背景模糊效果
更新主题色为粉色并添加动漫风格背景图
引入圆角字体提升可爱风格
新增开发文档记录改造计划
2026-01-11 12:59:41 +08:00

34 lines
1.0 KiB
Plaintext

<script>
function createEmoji(e: MouseEvent) {
const emojis = ["🌸", "💖", "✨", "🍬", "🎀", "🍭", "🍡", "🐱", "🍥"];
const emoji = document.createElement("div");
emoji.innerText = emojis[Math.floor(Math.random() * emojis.length)];
emoji.style.position = "fixed";
emoji.style.left = e.clientX + "px";
emoji.style.top = e.clientY + "px";
emoji.style.fontSize = Math.random() * 20 + 10 + "px";
emoji.style.pointerEvents = "none";
emoji.style.userSelect = "none";
emoji.style.zIndex = "9999";
emoji.style.transition = "all 1s ease-out";
// Initial randomness
const x = (Math.random() - 0.5) * 50;
const y = (Math.random() - 0.5) * 50;
document.body.appendChild(emoji);
// Animate
requestAnimationFrame(() => {
emoji.style.transform = `translate(${x}px, ${y - 50}px)`;
emoji.style.opacity = "0";
});
// Cleanup
setTimeout(() => {
emoji.remove();
}, 1000);
}
document.addEventListener("click", createEmoji);
</script>