绘制你的心 | QwQ粒子特效

                /* 绘制你的心 | QwQ粒子特效 */
                /* 作者：QwQ */
                /* 实现功能：点击任意位置生成方片可手动连成爱心，移动生成星星，添加涟漪效果 */

                /* 样式定义 */
                .ripple {
                    position: absolute;
                    border-radius: 50%;
                    transform: scale(0);
                    animation: ripple-effect 1.2s ease-out;
                }

                .heart {
                    position: absolute;
                    width: 20px;
                    height: 20px;
                    background: linear-gradient(45deg, #ff6b6b, #ff4d4d);
                    transform: rotate(45deg);
                    animation: float-effect 3s linear infinite;
                }

                .star {
                    position: absolute;
                    width: 5px;
                    height: 5px;
                    background: #ffd700;
                    border-radius: 50%;
                    animation: twinkle 1.5s infinite;
                }

                /* 动画效果 */
                @keyframes ripple-effect {
                    100% { transform: scale(3); opacity: 0; }
                }

                @keyframes float-effect {
                    0%, 100% { transform: translateY(0) rotate(45deg); }
                    50% { transform: translateY(-20px) rotate(45deg); }
                }

                @keyframes twinkle {
                    0%, 100% { opacity: 0.3; }
                    50% { opacity: 1; }
                }

                /* JavaScript 实现 */
                const colors = ['#ff6b6b', '#4ecdc4', '#45b7d1', '#96ce7c', '#ce93d8'];

                function createRipple(e) {
                    const ripple = document.createElement('div');
                    ripple.className = 'ripple';
                    ripple.style.left = `${e.clientX}px`;
                    ripple.style.top = `${e.clientY}px`;
                    ripple.style.background = colors[Math.floor(Math.random()*colors.length)];
                    document.body.appendChild(ripple);
                    setTimeout(() => ripple.remove(), 1200);
                }

                function createHeart(x, y) {
                    const heart = document.createElement('div');
                    heart.className = 'heart';
                    heart.style.left = `${x}px`;
                    heart.style.top = `${y}px`;
                    document.body.appendChild(heart);
                    setTimeout(() => heart.remove(), 3000);
                }

                function createStar(e) {
                    const star = document.createElement('div');
                    star.className = 'star';
                    star.style.left = `${e.clientX}px`;
                    star.style.top = `${e.clientY}px`;
                    document.body.appendChild(star);
                    setTimeout(() => star.remove(), 1500);
                }
            
查看 QwQ 原始提示词
QwQ粒子特效 绘制你的心

QwQ粒子特效绘制你的心
