KaiGeQQ凶吉每日测试源码可爱粉白版

05378972
温馨提示：本文最后更新于2025-06-12 09:44:03，某些文章具有时效性，若有错误或已失效，请在下方留言或联系站长

【项目简介】

这是一个超级可爱的 QQ 每日运势测试网页应用，采用梦幻粉白色系设计，充满少女心的界面风格，输入 QQ 号即可测试今日运势！

图片[1]-KaiGeQQ凶吉每日测试源码可爱粉白版-胖大海博客资源网

【主要功能】

  • QQ 号测试：输入 5 -12 位 QQ 号码即可开始测试
  •  三大运势指标：财运、桃花运、事业运数值评分（1-100 分）
  • 签卦系统：随机生成各种有趣的签卦结果
  • 星级评价：根据综合运势显示 1 – 7 颗星评级
  • 一键复制 QQ 群号功能

【设计特色】

  • 粉白梦幻渐变背景
  • 独角兽主题头像
  • 大量可爱 emoji 装饰元素
  • 毛玻璃效果和柔和阴影
  • 响应式设计，适配手机和电脑

【使用方法】

  • 1. 输入您的 QQ 号码（5-12 位数字）
  • 2. 点击 ” 开始测试 ” 按钮
  • 3. 查看您的今日运势结果
  • 4. 可以点击 ” 重新测试 ” 测试其他 QQ 号

【源码下载】

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>QQ凶吉每日测试</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        body {
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Microsoft YaHei', sans-serif;
            background: linear-gradient(135deg, #ffb3d1 0%, #ffc3e3 50%, #fff0f8 100%);
            min-height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 20px;
            position: relative;
            overflow-x: hidden;
        }
        body::before {
            content: '';
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-image: 
                radial-gradient(circle at 20% 20%, rgba(255, 182, 193, 0.3) 0%, transparent 50%),
                radial-gradient(circle at 80% 80%, rgba(255, 105, 180, 0.2) 0%, transparent 50%),
                radial-gradient(circle at 40% 70%, rgba(255, 182, 193, 0.2) 0%, transparent 50%);
            z-index: -1;
        }
        .container {
            background: rgba(255, 255, 255, 0.9);
            border-radius: 25px;
            padding: 30px;
            box-shadow: 0 20px 40px rgba(255, 105, 180, 0.2);
            max-width: 400px;
            width: 100%;
            text-align: center;
            backdrop-filter: blur(15px);
            border: 2px solid rgba(255, 182, 193, 0.3);
            position: relative;
        }
        .container::before {
            content: '🌸✨💕🦄🌙⭐️🍭🎀';
            position: absolute;
            top: -15px;
            left: 50%;
            transform: translateX(-50%);
            background: white;
            padding: 5px 15px;
            border-radius: 20px;
            font-size: 12px;
            color: #ff69b4;
            border: 2px solid rgba(255, 182, 193, 0.5);
        }
        .header {
            margin-bottom: 30px;
        }
        .avatar {
            width: 70px;
            height: 70px;
            border-radius: 50%;
            background: linear-gradient(135deg, #ff69b4, #ff1493);
            margin: 0 auto 15px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            font-size: 28px;
            font-weight: bold;
            box-shadow: 0 8px 16px rgba(255, 105, 180, 0.3);
            border: 3px solid white;
        }
        .title {
            font-size: 22px;
            color: #ff1493;
            margin-bottom: 8px;
            font-weight: bold;
            text-shadow: 1px 1px 2px rgba(255, 105, 180, 0.3);
        }
        .subtitle {
            color: #ff69b4;
            font-size: 14px;
            margin-bottom: 10px;
        }
        .cute-decoration {
            font-size: 16px;
            margin: 10px 0;
            opacity: 0.8;
        }
        .input-section {
            margin-bottom: 30px;
        }
        .qq-input {
            width: 100%;
            padding: 15px;
            border: 2px solid #e0e0e0;
            border-radius: 10px;
            font-size: 16px;
            text-align: center;
            margin-bottom: 15px;
            transition: border-color 0.3s;
        }
        .qq-input:focus {
            outline: none;
            border-color: #ff69b4;
            box-shadow: 0 0 10px rgba(255, 105, 180, 0.3);
        }
        .test-btn {
            width: 100%;
            padding: 15px;
            background: linear-gradient(135deg, #ff69b4, #ff1493);
            color: white;
            border: none;
            border-radius: 15px;
            font-size: 16px;
            cursor: pointer;
            transition: all 0.3s;
            box-shadow: 0 4px 15px rgba(255, 105, 180, 0.3);
            font-weight: bold;
        }
        .test-btn:hover {
            transform: translateY(-3px);
            box-shadow: 0 6px 20px rgba(255, 105, 180, 0.4);
        }
        .result-section {
            display: none;
            text-align: left;
        }
        .fortune-item {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 12px 0;
            border-bottom: 1px solid #f0f0f0;
        }
        .fortune-item:last-child {
            border-bottom: none;
        }
        .fortune-label {
            color: #333;
            font-weight: 500;
        }
        .fortune-value {
            font-weight: bold;
            color: #ff1493;
            font-size: 18px;
        }
        .divination {
            background: linear-gradient(135deg, #ffcccb, #ffb6c1);
            border-radius: 15px;
            padding: 18px;
            margin: 20px 0;
            text-align: center;
            border: 2px solid rgba(255, 105, 180, 0.2);
            box-shadow: 0 4px 12px rgba(255, 105, 180, 0.1);
        }
        .divination-title {
            font-size: 14px;
            color: #666;
            margin-bottom: 5px;
        }
        .divination-content {
            font-weight: bold;
            color: #333;
        }
        .comment {
            background: linear-gradient(135deg, #fff0f5, #ffeef8);
            border-radius: 15px;
            padding: 18px;
            margin: 20px 0;
            text-align: center;
            border: 2px solid rgba(255, 182, 193, 0.3);
            box-shadow: 0 4px 12px rgba(255, 105, 180, 0.1);
        }
        .comment-title {
            font-size: 14px;
            color: #666;
            margin-bottom: 5px;
        }
        .comment-content {
            font-size: 18px;
            font-weight: bold;
            color: #333;
        }
        .stars {
            display: flex;
            justify-content: center;
            gap: 3px;
            margin: 10px 0;
        }
        .star {
            color: #ffd700;
            font-size: 20px;
        }
        .star.empty {
            color: #ddd;
        }
        .ad-section {
            margin: 20px 0;
            padding: 15px;
            background: linear-gradient(135deg, #ffe4e1, #ffd1dc);
            border-radius: 15px;
            border: 2px solid rgba(255, 105, 180, 0.2);
            text-align: center;
        }
        .ad-title {
            font-size: 14px;
            color: #ff1493;
            font-weight: bold;
            margin-bottom: 8px;
        }
        .ad-link {
            color: #ff69b4;
            text-decoration: none;
            font-size: 13px;
            display: block;
            margin: 5px 0;
            padding: 8px;
            background: white;
            border-radius: 8px;
            transition: all 0.3s;
        }
        .ad-link:hover {
            background: #ff69b4;
            color: white;
            transform: scale(1.02);
        }
        .reset-btn {
            margin-top: 20px;
            width: 100%;
            padding: 15px;
            background: linear-gradient(135deg, #ffc0cb, #ffb6c1);
            color: #ff1493;
            border: 2px solid #ff69b4;
            border-radius: 15px;
            cursor: pointer;
            font-weight: bold;
            transition: all 0.3s;
        }
        .reset-btn:hover {
            background: linear-gradient(135deg, #ff69b4, #ff1493);
            color: white;
            transform: translateY(-2px);
        }
    </style>
</head>
<body>
    <div class="container">
        <div class="header">
            <div class="avatar">🦄</div>
            <div class="title">💖 QQ凶吉每日测试 💖</div>
            <div class="subtitle">✨ 输入QQ号，测试今日运势 ✨</div>
            <div class="cute-decoration">🌸 🦋 🌙 ⭐️ 🍭 🎀 🌈 💕</div>
        </div>
        <div class="input-section" id="inputSection">
            <input type="text" class="qq-input" id="qqInput" placeholder="请输入您的QQ号码" maxlength="12">
            <button class="test-btn" onclick="startTest()">开始测试</button>
        </div>
        <div class="result-section" id="resultSection">
            <div class="fortune-item">
                <span class="fortune-label">💰 财运：</span>
                <span class="fortune-value" id="wealth">0</span>
            </div>
            <div class="fortune-item">
                <span class="fortune-label">🌸 桃花运：</span>
                <span class="fortune-value" id="love">0</span>
            </div>
            <div class="fortune-item">
                <span class="fortune-label">📈 事业运：</span>
                <span class="fortune-value" id="career">0</span>
            </div>
            <div class="divination">
                <div class="divination-title">🎴 签卦：</div>
                <div class="divination-content" id="divination">无</div>
            </div>
            <div class="comment">
                <div class="comment-title">💬 点评：</div>
                <div class="comment-content" id="comment">无</div>
            </div>
            <div class="stars" id="stars"></div>
            <div class="ad-section">
                <div class="ad-title">🌟 精选推荐 🌟</div>
                <a href="https://pdha.top/" target="_blank" class="ad-link">
                    ☁️ 胖大海资源网
                </a>
                <div class="ad-link" onclick="copyQQGroup()">
                    👥 QQ技术交流群：290093633 (点击复制)
                </div>
            </div>
            <button class="reset-btn" onclick="resetTest()">🔄 重新测试</button>
        </div>
    </div>
    <script>
        // 签卦列表
        const divinations = [
            "「穷途的山炮」", "「幸运的星空」", "「平凡的日常」", "「神秘的月夜」",
            "「温暖的阳光」", "「狂野的暴风」", "「宁静的湖泊」", "「燃烧的火焰」",
            "「茂盛的森林」", "「无尽的海洋」", "「高耸的山峰」", "「广阔的草原」",
            "「闪耀的钻石」", "「古老的智慧」", "「新生的希望」", "「永恒的爱情」"
        ];
        // 点评列表
        const comments = [
            "大吉", "中吉", "小吉", "吉", "半吉", "末吉", "凶", "小凶", "半凶", "末凶", "大凶"
        ];
        // 根据QQ号生成伪随机数
        function generateRandom(qq, seed) {
            const combined = parseInt(qq) + seed;
            const x = Math.sin(combined) * 10000;
            return x - Math.floor(x);
        }
        // 根据QQ号生成运势数据
        function generateFortune(qq) {
            const today = new Date().toDateString(); // 确保每天的结果不同
            const baseSeed = qq.split('').reduce((sum, digit) => sum + parseInt(digit), 0);
            const daySeed = today.split('').reduce((sum, char) => sum + char.charCodeAt(0), 0);
            
            const wealth = Math.floor(generateRandom(qq, baseSeed + 1 + daySeed) * 100) + 1;
            const love = Math.floor(generateRandom(qq, baseSeed + 2 + daySeed) * 100) + 1;
            const career = Math.floor(generateRandom(qq, baseSeed + 3 + daySeed) * 100) + 1;
            
            const divinationIndex = Math.floor(generateRandom(qq, baseSeed + 4 + daySeed) * divinations.length);
            const commentIndex = Math.floor(generateRandom(qq, baseSeed + 5 + daySeed) * comments.length);
            
            const averageScore = (wealth + love + career) / 3;
            const stars = Math.max(1, Math.min(7, Math.floor(averageScore / 15) + 1));
            
            return {
                wealth,
                love,
                career,
                divination: divinations[divinationIndex],
                comment: comments[commentIndex],
                stars
            };
        }
        // 显示星级
        function displayStars(count) {
            const starsContainer = document.getElementById('stars');
            starsContainer.innerHTML = '';
            
            for (let i = 1; i <= 7; i++) {
                const star = document.createElement('span');
                star.className = i <= count ? 'star' : 'star empty';
                star.textContent = '★';
                starsContainer.appendChild(star);
            }
        }
        // 开始测试
        function startTest() {
            const qqInput = document.getElementById('qqInput');
            const qq = qqInput.value.trim();
            
            if (!qq || !/^\d+$/.test(qq)) {
                alert('请输入有效的QQ号码！');
                return;
            }
            
            if (qq.length < 5 || qq.length > 12) {
                alert('QQ号码长度应在5-12位之间！');
                return;
            }
            
            const fortune = generateFortune(qq);
            
            // 更新显示
            document.getElementById('wealth').textContent = fortune.wealth;
            document.getElementById('love').textContent = fortune.love;
            document.getElementById('career').textContent = fortune.career;
            document.getElementById('divination').textContent = fortune.divination;
            document.getElementById('comment').textContent = fortune.comment;
            
            displayStars(fortune.stars);
            
            // 切换显示
            document.getElementById('inputSection').style.display = 'none';
            document.getElementById('resultSection').style.display = 'block';
        }
        // 重新测试
        function resetTest() {
            document.getElementById('inputSection').style.display = 'block';
            document.getElementById('resultSection').style.display = 'none';
            document.getElementById('qqInput').value = '';
        }
        // 复制QQ群号
        function copyQQGroup() {
            const groupNumber = '290093633';
            if (navigator.clipboard) {
                navigator.clipboard.writeText(groupNumber).then(() => {
                    alert('QQ群号已复制：' + groupNumber);
                }).catch(() => {
                    alert('QQ技术交流群：' + groupNumber);
                });
            } else {
                alert('QQ技术交流群：' + groupNumber);
            }
        }
        // 回车键触发测试
        document.getElementById('qqInput').addEventListener('keypress', function(e) {
            if (e.key === 'Enter') {
                startTest();
            }
        });
    </script>
</body>
</html>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>QQ凶吉每日测试</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        body {
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Microsoft YaHei', sans-serif;
            background: linear-gradient(135deg, #ffb3d1 0%, #ffc3e3 50%, #fff0f8 100%);
            min-height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 20px;
            position: relative;
            overflow-x: hidden;
        }

        body::before {
            content: '';
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-image: 
                radial-gradient(circle at 20% 20%, rgba(255, 182, 193, 0.3) 0%, transparent 50%),
                radial-gradient(circle at 80% 80%, rgba(255, 105, 180, 0.2) 0%, transparent 50%),
                radial-gradient(circle at 40% 70%, rgba(255, 182, 193, 0.2) 0%, transparent 50%);
            z-index: -1;
        }

        .container {
            background: rgba(255, 255, 255, 0.9);
            border-radius: 25px;
            padding: 30px;
            box-shadow: 0 20px 40px rgba(255, 105, 180, 0.2);
            max-width: 400px;
            width: 100%;
            text-align: center;
            backdrop-filter: blur(15px);
            border: 2px solid rgba(255, 182, 193, 0.3);
            position: relative;
        }

        .container::before {
            content: '🌸✨💕🦄🌙⭐️🍭🎀';
            position: absolute;
            top: -15px;
            left: 50%;
            transform: translateX(-50%);
            background: white;
            padding: 5px 15px;
            border-radius: 20px;
            font-size: 12px;
            color: #ff69b4;
            border: 2px solid rgba(255, 182, 193, 0.5);
        }

        .header {
            margin-bottom: 30px;
        }

        .avatar {
            width: 70px;
            height: 70px;
            border-radius: 50%;
            background: linear-gradient(135deg, #ff69b4, #ff1493);
            margin: 0 auto 15px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            font-size: 28px;
            font-weight: bold;
            box-shadow: 0 8px 16px rgba(255, 105, 180, 0.3);
            border: 3px solid white;
        }

        .title {
            font-size: 22px;
            color: #ff1493;
            margin-bottom: 8px;
            font-weight: bold;
            text-shadow: 1px 1px 2px rgba(255, 105, 180, 0.3);
        }

        .subtitle {
            color: #ff69b4;
            font-size: 14px;
            margin-bottom: 10px;
        }

        .cute-decoration {
            font-size: 16px;
            margin: 10px 0;
            opacity: 0.8;
        }

        .input-section {
            margin-bottom: 30px;
        }

        .qq-input {
            width: 100%;
            padding: 15px;
            border: 2px solid #e0e0e0;
            border-radius: 10px;
            font-size: 16px;
            text-align: center;
            margin-bottom: 15px;
            transition: border-color 0.3s;
        }

        .qq-input:focus {
            outline: none;
            border-color: #ff69b4;
            box-shadow: 0 0 10px rgba(255, 105, 180, 0.3);
        }

        .test-btn {
            width: 100%;
            padding: 15px;
            background: linear-gradient(135deg, #ff69b4, #ff1493);
            color: white;
            border: none;
            border-radius: 15px;
            font-size: 16px;
            cursor: pointer;
            transition: all 0.3s;
            box-shadow: 0 4px 15px rgba(255, 105, 180, 0.3);
            font-weight: bold;
        }

        .test-btn:hover {
            transform: translateY(-3px);
            box-shadow: 0 6px 20px rgba(255, 105, 180, 0.4);
        }

        .result-section {
            display: none;
            text-align: left;
        }

        .fortune-item {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 12px 0;
            border-bottom: 1px solid #f0f0f0;
        }

        .fortune-item:last-child {
            border-bottom: none;
        }

        .fortune-label {
            color: #333;
            font-weight: 500;
        }

        .fortune-value {
            font-weight: bold;
            color: #ff1493;
            font-size: 18px;
        }

        .divination {
            background: linear-gradient(135deg, #ffcccb, #ffb6c1);
            border-radius: 15px;
            padding: 18px;
            margin: 20px 0;
            text-align: center;
            border: 2px solid rgba(255, 105, 180, 0.2);
            box-shadow: 0 4px 12px rgba(255, 105, 180, 0.1);
        }

        .divination-title {
            font-size: 14px;
            color: #666;
            margin-bottom: 5px;
        }

        .divination-content {
            font-weight: bold;
            color: #333;
        }

        .comment {
            background: linear-gradient(135deg, #fff0f5, #ffeef8);
            border-radius: 15px;
            padding: 18px;
            margin: 20px 0;
            text-align: center;
            border: 2px solid rgba(255, 182, 193, 0.3);
            box-shadow: 0 4px 12px rgba(255, 105, 180, 0.1);
        }

        .comment-title {
            font-size: 14px;
            color: #666;
            margin-bottom: 5px;
        }

        .comment-content {
            font-size: 18px;
            font-weight: bold;
            color: #333;
        }

        .stars {
            display: flex;
            justify-content: center;
            gap: 3px;
            margin: 10px 0;
        }

        .star {
            color: #ffd700;
            font-size: 20px;
        }

        .star.empty {
            color: #ddd;
        }

        .ad-section {
            margin: 20px 0;
            padding: 15px;
            background: linear-gradient(135deg, #ffe4e1, #ffd1dc);
            border-radius: 15px;
            border: 2px solid rgba(255, 105, 180, 0.2);
            text-align: center;
        }

        .ad-title {
            font-size: 14px;
            color: #ff1493;
            font-weight: bold;
            margin-bottom: 8px;
        }

        .ad-link {
            color: #ff69b4;
            text-decoration: none;
            font-size: 13px;
            display: block;
            margin: 5px 0;
            padding: 8px;
            background: white;
            border-radius: 8px;
            transition: all 0.3s;
        }

        .ad-link:hover {
            background: #ff69b4;
            color: white;
            transform: scale(1.02);
        }

        .reset-btn {
            margin-top: 20px;
            width: 100%;
            padding: 15px;
            background: linear-gradient(135deg, #ffc0cb, #ffb6c1);
            color: #ff1493;
            border: 2px solid #ff69b4;
            border-radius: 15px;
            cursor: pointer;
            font-weight: bold;
            transition: all 0.3s;
        }

        .reset-btn:hover {
            background: linear-gradient(135deg, #ff69b4, #ff1493);
            color: white;
            transform: translateY(-2px);
        }
    </style>
</head>
<body>
    <div class="container">
        <div class="header">
            <div class="avatar">🦄</div>
            <div class="title">💖 QQ凶吉每日测试 💖</div>
            <div class="subtitle">✨ 输入QQ号，测试今日运势 ✨</div>
            <div class="cute-decoration">🌸 🦋 🌙 ⭐️ 🍭 🎀 🌈 💕</div>
        </div>

        <div class="input-section" id="inputSection">
            <input type="text" class="qq-input" id="qqInput" placeholder="请输入您的QQ号码" maxlength="12">
            <button class="test-btn" onclick="startTest()">开始测试</button>
        </div>

        <div class="result-section" id="resultSection">
            <div class="fortune-item">
                <span class="fortune-label">💰 财运：</span>
                <span class="fortune-value" id="wealth">0</span>
            </div>
            <div class="fortune-item">
                <span class="fortune-label">🌸 桃花运：</span>
                <span class="fortune-value" id="love">0</span>
            </div>
            <div class="fortune-item">
                <span class="fortune-label">📈 事业运：</span>
                <span class="fortune-value" id="career">0</span>
            </div>

            <div class="divination">
                <div class="divination-title">🎴 签卦：</div>
                <div class="divination-content" id="divination">无</div>
            </div>

            <div class="comment">
                <div class="comment-title">💬 点评：</div>
                <div class="comment-content" id="comment">无</div>
            </div>

            <div class="stars" id="stars"></div>

            <div class="ad-section">
                <div class="ad-title">🌟 精选推荐 🌟</div>
                <a href="https://pdha.top/" target="_blank" class="ad-link">
                    ☁️ 胖大海资源网
                </a>
                <div class="ad-link" onclick="copyQQGroup()">
                    👥 QQ技术交流群：290093633 (点击复制)
                </div>
            </div>

            <button class="reset-btn" onclick="resetTest()">🔄 重新测试</button>
        </div>
    </div>

    <script>
        // 签卦列表
        const divinations = [
            "「穷途的山炮」", "「幸运的星空」", "「平凡的日常」", "「神秘的月夜」",
            "「温暖的阳光」", "「狂野的暴风」", "「宁静的湖泊」", "「燃烧的火焰」",
            "「茂盛的森林」", "「无尽的海洋」", "「高耸的山峰」", "「广阔的草原」",
            "「闪耀的钻石」", "「古老的智慧」", "「新生的希望」", "「永恒的爱情」"
        ];

        // 点评列表
        const comments = [
            "大吉", "中吉", "小吉", "吉", "半吉", "末吉", "凶", "小凶", "半凶", "末凶", "大凶"
        ];

        // 根据QQ号生成伪随机数
        function generateRandom(qq, seed) {
            const combined = parseInt(qq) + seed;
            const x = Math.sin(combined) * 10000;
            return x - Math.floor(x);
        }

        // 根据QQ号生成运势数据
        function generateFortune(qq) {
            const today = new Date().toDateString(); // 确保每天的结果不同
            const baseSeed = qq.split('').reduce((sum, digit) => sum + parseInt(digit), 0);
            const daySeed = today.split('').reduce((sum, char) => sum + char.charCodeAt(0), 0);
            
            const wealth = Math.floor(generateRandom(qq, baseSeed + 1 + daySeed) * 100) + 1;
            const love = Math.floor(generateRandom(qq, baseSeed + 2 + daySeed) * 100) + 1;
            const career = Math.floor(generateRandom(qq, baseSeed + 3 + daySeed) * 100) + 1;
            
            const divinationIndex = Math.floor(generateRandom(qq, baseSeed + 4 + daySeed) * divinations.length);
            const commentIndex = Math.floor(generateRandom(qq, baseSeed + 5 + daySeed) * comments.length);
            
            const averageScore = (wealth + love + career) / 3;
            const stars = Math.max(1, Math.min(7, Math.floor(averageScore / 15) + 1));
            
            return {
                wealth,
                love,
                career,
                divination: divinations[divinationIndex],
                comment: comments[commentIndex],
                stars
            };
        }

        // 显示星级
        function displayStars(count) {
            const starsContainer = document.getElementById('stars');
            starsContainer.innerHTML = '';
            
            for (let i = 1; i <= 7; i++) {
                const star = document.createElement('span');
                star.className = i <= count ? 'star' : 'star empty';
                star.textContent = '★';
                starsContainer.appendChild(star);
            }
        }

        // 开始测试
        function startTest() {
            const qqInput = document.getElementById('qqInput');
            const qq = qqInput.value.trim();
            
            if (!qq || !/^\d+$/.test(qq)) {
                alert('请输入有效的QQ号码！');
                return;
            }
            
            if (qq.length < 5 || qq.length > 12) {
                alert('QQ号码长度应在5-12位之间！');
                return;
            }
            
            const fortune = generateFortune(qq);
            
            // 更新显示
            document.getElementById('wealth').textContent = fortune.wealth;
            document.getElementById('love').textContent = fortune.love;
            document.getElementById('career').textContent = fortune.career;
            document.getElementById('divination').textContent = fortune.divination;
            document.getElementById('comment').textContent = fortune.comment;
            
            displayStars(fortune.stars);
            
            // 切换显示
            document.getElementById('inputSection').style.display = 'none';
            document.getElementById('resultSection').style.display = 'block';
        }

        // 重新测试
        function resetTest() {
            document.getElementById('inputSection').style.display = 'block';
            document.getElementById('resultSection').style.display = 'none';
            document.getElementById('qqInput').value = '';
        }

        // 复制QQ群号
        function copyQQGroup() {
            const groupNumber = '290093633';
            if (navigator.clipboard) {
                navigator.clipboard.writeText(groupNumber).then(() => {
                    alert('QQ群号已复制：' + groupNumber);
                }).catch(() => {
                    alert('QQ技术交流群：' + groupNumber);
                });
            } else {
                alert('QQ技术交流群：' + groupNumber);
            }
        }

        // 回车键触发测试
        document.getElementById('qqInput').addEventListener('keypress', function(e) {
            if (e.key === 'Enter') {
                startTest();
            }
        });
    </script>
</body>
</html>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>QQ凶吉每日测试</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        body {
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Microsoft YaHei', sans-serif;
            background: linear-gradient(135deg, #ffb3d1 0%, #ffc3e3 50%, #fff0f8 100%);
            min-height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 20px;
            position: relative;
            overflow-x: hidden;
        }

        body::before {
            content: '';
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-image: 
                radial-gradient(circle at 20% 20%, rgba(255, 182, 193, 0.3) 0%, transparent 50%),
                radial-gradient(circle at 80% 80%, rgba(255, 105, 180, 0.2) 0%, transparent 50%),
                radial-gradient(circle at 40% 70%, rgba(255, 182, 193, 0.2) 0%, transparent 50%);
            z-index: -1;
        }

        .container {
            background: rgba(255, 255, 255, 0.9);
            border-radius: 25px;
            padding: 30px;
            box-shadow: 0 20px 40px rgba(255, 105, 180, 0.2);
            max-width: 400px;
            width: 100%;
            text-align: center;
            backdrop-filter: blur(15px);
            border: 2px solid rgba(255, 182, 193, 0.3);
            position: relative;
        }

        .container::before {
            content: '🌸✨💕🦄🌙⭐️🍭🎀';
            position: absolute;
            top: -15px;
            left: 50%;
            transform: translateX(-50%);
            background: white;
            padding: 5px 15px;
            border-radius: 20px;
            font-size: 12px;
            color: #ff69b4;
            border: 2px solid rgba(255, 182, 193, 0.5);
        }

        .header {
            margin-bottom: 30px;
        }

        .avatar {
            width: 70px;
            height: 70px;
            border-radius: 50%;
            background: linear-gradient(135deg, #ff69b4, #ff1493);
            margin: 0 auto 15px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            font-size: 28px;
            font-weight: bold;
            box-shadow: 0 8px 16px rgba(255, 105, 180, 0.3);
            border: 3px solid white;
        }

        .title {
            font-size: 22px;
            color: #ff1493;
            margin-bottom: 8px;
            font-weight: bold;
            text-shadow: 1px 1px 2px rgba(255, 105, 180, 0.3);
        }

        .subtitle {
            color: #ff69b4;
            font-size: 14px;
            margin-bottom: 10px;
        }

        .cute-decoration {
            font-size: 16px;
            margin: 10px 0;
            opacity: 0.8;
        }

        .input-section {
            margin-bottom: 30px;
        }

        .qq-input {
            width: 100%;
            padding: 15px;
            border: 2px solid #e0e0e0;
            border-radius: 10px;
            font-size: 16px;
            text-align: center;
            margin-bottom: 15px;
            transition: border-color 0.3s;
        }

        .qq-input:focus {
            outline: none;
            border-color: #ff69b4;
            box-shadow: 0 0 10px rgba(255, 105, 180, 0.3);
        }

        .test-btn {
            width: 100%;
            padding: 15px;
            background: linear-gradient(135deg, #ff69b4, #ff1493);
            color: white;
            border: none;
            border-radius: 15px;
            font-size: 16px;
            cursor: pointer;
            transition: all 0.3s;
            box-shadow: 0 4px 15px rgba(255, 105, 180, 0.3);
            font-weight: bold;
        }

        .test-btn:hover {
            transform: translateY(-3px);
            box-shadow: 0 6px 20px rgba(255, 105, 180, 0.4);
        }

        .result-section {
            display: none;
            text-align: left;
        }

        .fortune-item {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 12px 0;
            border-bottom: 1px solid #f0f0f0;
        }

        .fortune-item:last-child {
            border-bottom: none;
        }

        .fortune-label {
            color: #333;
            font-weight: 500;
        }

        .fortune-value {
            font-weight: bold;
            color: #ff1493;
            font-size: 18px;
        }

        .divination {
            background: linear-gradient(135deg, #ffcccb, #ffb6c1);
            border-radius: 15px;
            padding: 18px;
            margin: 20px 0;
            text-align: center;
            border: 2px solid rgba(255, 105, 180, 0.2);
            box-shadow: 0 4px 12px rgba(255, 105, 180, 0.1);
        }

        .divination-title {
            font-size: 14px;
            color: #666;
            margin-bottom: 5px;
        }

        .divination-content {
            font-weight: bold;
            color: #333;
        }

        .comment {
            background: linear-gradient(135deg, #fff0f5, #ffeef8);
            border-radius: 15px;
            padding: 18px;
            margin: 20px 0;
            text-align: center;
            border: 2px solid rgba(255, 182, 193, 0.3);
            box-shadow: 0 4px 12px rgba(255, 105, 180, 0.1);
        }

        .comment-title {
            font-size: 14px;
            color: #666;
            margin-bottom: 5px;
        }

        .comment-content {
            font-size: 18px;
            font-weight: bold;
            color: #333;
        }

        .stars {
            display: flex;
            justify-content: center;
            gap: 3px;
            margin: 10px 0;
        }

        .star {
            color: #ffd700;
            font-size: 20px;
        }

        .star.empty {
            color: #ddd;
        }

        .ad-section {
            margin: 20px 0;
            padding: 15px;
            background: linear-gradient(135deg, #ffe4e1, #ffd1dc);
            border-radius: 15px;
            border: 2px solid rgba(255, 105, 180, 0.2);
            text-align: center;
        }

        .ad-title {
            font-size: 14px;
            color: #ff1493;
            font-weight: bold;
            margin-bottom: 8px;
        }

        .ad-link {
            color: #ff69b4;
            text-decoration: none;
            font-size: 13px;
            display: block;
            margin: 5px 0;
            padding: 8px;
            background: white;
            border-radius: 8px;
            transition: all 0.3s;
        }

        .ad-link:hover {
            background: #ff69b4;
            color: white;
            transform: scale(1.02);
        }

        .reset-btn {
            margin-top: 20px;
            width: 100%;
            padding: 15px;
            background: linear-gradient(135deg, #ffc0cb, #ffb6c1);
            color: #ff1493;
            border: 2px solid #ff69b4;
            border-radius: 15px;
            cursor: pointer;
            font-weight: bold;
            transition: all 0.3s;
        }

        .reset-btn:hover {
            background: linear-gradient(135deg, #ff69b4, #ff1493);
            color: white;
            transform: translateY(-2px);
        }
    </style>
</head>
<body>
    <div class="container">
        <div class="header">
            <div class="avatar">🦄</div>
            <div class="title">💖 QQ凶吉每日测试 💖</div>
            <div class="subtitle">✨ 输入QQ号，测试今日运势 ✨</div>
            <div class="cute-decoration">🌸 🦋 🌙 ⭐️ 🍭 🎀 🌈 💕</div>
        </div>

        <div class="input-section" id="inputSection">
            <input type="text" class="qq-input" id="qqInput" placeholder="请输入您的QQ号码" maxlength="12">
            <button class="test-btn" onclick="startTest()">开始测试</button>
        </div>

        <div class="result-section" id="resultSection">
            <div class="fortune-item">
                <span class="fortune-label">💰 财运：</span>
                <span class="fortune-value" id="wealth">0</span>
            </div>
            <div class="fortune-item">
                <span class="fortune-label">🌸 桃花运：</span>
                <span class="fortune-value" id="love">0</span>
            </div>
            <div class="fortune-item">
                <span class="fortune-label">📈 事业运：</span>
                <span class="fortune-value" id="career">0</span>
            </div>

            <div class="divination">
                <div class="divination-title">🎴 签卦：</div>
                <div class="divination-content" id="divination">无</div>
            </div>

            <div class="comment">
                <div class="comment-title">💬 点评：</div>
                <div class="comment-content" id="comment">无</div>
            </div>

            <div class="stars" id="stars"></div>

            <div class="ad-section">
                <div class="ad-title">🌟 精选推荐 🌟</div>
                <a href="https://pdha.top/" target="_blank" class="ad-link">
                    ☁️ 胖大海资源网
                </a>
                <div class="ad-link" onclick="copyQQGroup()">
                    👥 QQ技术交流群：290093633 (点击复制)
                </div>
            </div>

            <button class="reset-btn" onclick="resetTest()">🔄 重新测试</button>
        </div>
    </div>

    <script>
        // 签卦列表
        const divinations = [
            "「穷途的山炮」", "「幸运的星空」", "「平凡的日常」", "「神秘的月夜」",
            "「温暖的阳光」", "「狂野的暴风」", "「宁静的湖泊」", "「燃烧的火焰」",
            "「茂盛的森林」", "「无尽的海洋」", "「高耸的山峰」", "「广阔的草原」",
            "「闪耀的钻石」", "「古老的智慧」", "「新生的希望」", "「永恒的爱情」"
        ];

        // 点评列表
        const comments = [
            "大吉", "中吉", "小吉", "吉", "半吉", "末吉", "凶", "小凶", "半凶", "末凶", "大凶"
        ];

        // 根据QQ号生成伪随机数
        function generateRandom(qq, seed) {
            const combined = parseInt(qq) + seed;
            const x = Math.sin(combined) * 10000;
            return x - Math.floor(x);
        }

        // 根据QQ号生成运势数据
        function generateFortune(qq) {
            const today = new Date().toDateString(); // 确保每天的结果不同
            const baseSeed = qq.split('').reduce((sum, digit) => sum + parseInt(digit), 0);
            const daySeed = today.split('').reduce((sum, char) => sum + char.charCodeAt(0), 0);
            
            const wealth = Math.floor(generateRandom(qq, baseSeed + 1 + daySeed) * 100) + 1;
            const love = Math.floor(generateRandom(qq, baseSeed + 2 + daySeed) * 100) + 1;
            const career = Math.floor(generateRandom(qq, baseSeed + 3 + daySeed) * 100) + 1;
            
            const divinationIndex = Math.floor(generateRandom(qq, baseSeed + 4 + daySeed) * divinations.length);
            const commentIndex = Math.floor(generateRandom(qq, baseSeed + 5 + daySeed) * comments.length);
            
            const averageScore = (wealth + love + career) / 3;
            const stars = Math.max(1, Math.min(7, Math.floor(averageScore / 15) + 1));
            
            return {
                wealth,
                love,
                career,
                divination: divinations[divinationIndex],
                comment: comments[commentIndex],
                stars
            };
        }

        // 显示星级
        function displayStars(count) {
            const starsContainer = document.getElementById('stars');
            starsContainer.innerHTML = '';
            
            for (let i = 1; i <= 7; i++) {
                const star = document.createElement('span');
                star.className = i <= count ? 'star' : 'star empty';
                star.textContent = '★';
                starsContainer.appendChild(star);
            }
        }

        // 开始测试
        function startTest() {
            const qqInput = document.getElementById('qqInput');
            const qq = qqInput.value.trim();
            
            if (!qq || !/^\d+$/.test(qq)) {
                alert('请输入有效的QQ号码！');
                return;
            }
            
            if (qq.length < 5 || qq.length > 12) {
                alert('QQ号码长度应在5-12位之间！');
                return;
            }
            
            const fortune = generateFortune(qq);
            
            // 更新显示
            document.getElementById('wealth').textContent = fortune.wealth;
            document.getElementById('love').textContent = fortune.love;
            document.getElementById('career').textContent = fortune.career;
            document.getElementById('divination').textContent = fortune.divination;
            document.getElementById('comment').textContent = fortune.comment;
            
            displayStars(fortune.stars);
            
            // 切换显示
            document.getElementById('inputSection').style.display = 'none';
            document.getElementById('resultSection').style.display = 'block';
        }

        // 重新测试
        function resetTest() {
            document.getElementById('inputSection').style.display = 'block';
            document.getElementById('resultSection').style.display = 'none';
            document.getElementById('qqInput').value = '';
        }

        // 复制QQ群号
        function copyQQGroup() {
            const groupNumber = '290093633';
            if (navigator.clipboard) {
                navigator.clipboard.writeText(groupNumber).then(() => {
                    alert('QQ群号已复制：' + groupNumber);
                }).catch(() => {
                    alert('QQ技术交流群：' + groupNumber);
                });
            } else {
                alert('QQ技术交流群：' + groupNumber);
            }
        }

        // 回车键触发测试
        document.getElementById('qqInput').addEventListener('keypress', function(e) {
            if (e.key === 'Enter') {
                startTest();
            }
        });
    </script>
</body>
</html>
------本页内容已结束，喜欢请分享------

感谢您的来访，获取更多精彩文章请收藏本站。

------关注微信公众号：胖大海TuT------
© 版权声明
版权声明 1 本网站名称：胖大海博客资源网
2 本站永久网址：https://www.pdha.top
3 本网站的文章部分内容可能来源于网络，仅供大家学习与参考，如有侵权，请联系站长QQ941093035进行删除处理。
4 本站一切资源不代表本站立场，并不代表本站赞同其观点和对其真实性负责。
5 本站一律禁止以任何方式发布或转载任何违法的相关信息，访客发现请向站长举报
6 本站资源大多存储在云盘，如发现链接失效，请联系我们我们会第一时间更新。
THE END
HTML源码
喜欢就支持一下吧
点赞972 分享
Life is expensive. You know, you have to be responsible.
生活很昂贵，你需要负责。
xiaohai的头像-胖大海博客资源网黄金会员
相关推荐
评论 抢沙发

请登录后发表评论

    暂无评论内容

文章目录
超清无广告视频观看 速讯影院
在线视频解析 蓝光解析
抖音视频去水印 抖音去水印
实用较全的工具箱 胖大海工具箱
胖大海免费API接口 免费API
微信公众号：胖大海TuT