</> game-memory.php

93 行5740 字节.php
📥 下载源码 🔙 返回工具
1<?php class=class="string">"keyword">header(class="string">'Content-Type: text/html; charset=utf-class="number">8'); ?>
2<!DOCTYPE html><class="tag">html lang="zh-CN"><class="tag">head><class="tag">meta charset="UTF-class="number">8"><class="tag">meta name="viewport" content="width=device-width,initial-scale=class="number">1.0">
3<class="tag">title>记忆翻牌 - η空间</class="tag">title>
4<class="tag">meta name="description" content="记忆翻牌游戏,考验你的记忆力。翻翻乐,找到所有配对吧。">
5<class="tag">link rel="stylesheet" href="/tools/share.css"><class="tag">link rel="stylesheet" href="/assets/pet-cat.css">
6<class="tag">style>
7*{margin:class="number">0;padding:class="number">0;box-sizing:border-box}
8body{font-family:class="string">'Outfit',-apple-system,sans-serif;background:class=class="string">"keyword">class=class="string">"comment">#0C0C0C;color:#F7F5F0;min-height:100vh;display:flex;flex-direction:column;align-items:center}
9h1{margin-top:30px;font-size:24px}h1 .a{color:class=class="string">"keyword">class=class="string">"comment">#FF6B35}
10.info{display:flex;gap:20px;margin:12px class="number">0;font-size:14px;color:class=class="string">"keyword">class=class="string">"comment">#class="number">888}
11.info .num{font-weight:class="number">700;color:class=class="string">"keyword">class=class="string">"comment">#FF6B35}
12.board{display:grid;gap:6px;max-width:450px;margin:class="number">0 auto}
13.card{width:64px;height:64px;border-radius:10px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:28px;transition:all .3s;background:class=class="string">"keyword">class=class="string">"comment">#2a2a2a;border:1px solid #class="number">333;user-select:none}
14.card.hidden{background:class=class="string">"keyword">class=class="string">"comment">#1a1a2e;border-color:#2a2a4e}
15.card.hidden:hover{background:class=class="string">"keyword">class=class="string">"comment">#2a2a4e;border-color:#4a4a6e}
16.card.matched{background:rgba(class="number">74,class="number">222,class="number">128,class="number">0.15);border-color:class=class="string">"keyword">class=class="string">"comment">#4ade80;opacity:class="number">0.6;cursor:default}
17.card.selected{background:rgba(class="number">255,class="number">107,class="number">53,class="number">0.15);border-color:class=class="string">"keyword">class=class="string">"comment">#FF6B35;transform:scale(class="number">1.05)}
18.controls{margin-top:16px;display:flex;gap:10px}
19.btn{padding:8px 24px;border:none;border-radius:8px;font-size:14px;font-weight:class="number">600;cursor:pointer}
20.btn-class=class="string">"keyword">new{background:class=class="string">"keyword">class=class="string">"comment">#FF6B35;color:#fff}.btn-class=class="string">"keyword">new:hover{background:#e85a2a}
21.btn-diff{background:transparent;border:1px solid class=class="string">"keyword">class=class="string">"comment">#class="number">333;color:#ccc;padding:8px 12px}
22.btn-diff.active{border-color:class=class="string">"keyword">class=class="string">"comment">#FF6B35;color:#FF6B35}
23</class="tag">style></class="tag">head><class="tag">body>
24<class="tag">h1><class="tag">span class=class="string">"keyword">class="a">🧠</class="tag">span> 记忆翻牌</class="tag">h1>
25<class="tag">p style="font-size:12px;color:class=class="string">"keyword">class=class="string">"comment">#class="number">555;margin-bottom:8px;text-align:center">🧠 点击翻开卡片,记住位置,配对相同图案。全部配对齐获胜!</class="tag">p>
26<class="tag">div class=class="string">"keyword">class="info"><class="tag">span>步数 <class="tag">span class=class="string">"keyword">class="num" id="moves">class="number">0</class="tag">span></class="tag">span><class="tag">span>配对 <class="tag">span class=class="string">"keyword">class="num" id="pairs">class="number">0</class="tag">span><class="tag">span>/<class="tag">span id="totalPairs">class="number">6</class="tag">span></class="tag">span></class="tag">span></class="tag">div>
27<class="tag">div class=class="string">"keyword">class="board" id="board"></class="tag">div>
28<class="tag">div class=class="string">"keyword">class="controls">
29<class="tag">button class=class="string">"keyword">class="btn btn-class=class="string">"keyword">new" onclick="startGame()">🔄 新游戏</class="tag">button>
30<class="tag">button class=class="string">"keyword">class="btn btn-diff active" onclick="setSize(class="number">0)">class="number">4×class="number">3</class="tag">button>
31<class="tag">button class=class="string">"keyword">class="btn btn-diff" onclick="setSize(class="number">1)">class="number">4×class="number">4</class="tag">button>
32<class="tag">button class=class="string">"keyword">class="btn btn-diff" onclick="setSize(class="number">2)">class="number">6×class="number">4</class="tag">button>
33</class="tag">div>
34<class="tag">script src="/tools/share.js"></class="tag">script><class="tag">script src="/assets/pet-cat.js"></class="tag">script>
35<class="tag">script>
36class=class="string">"keyword">var emojis=[class="string">'🐱',class="string">'🐶',class="string">'🐰',class="string">'🐼',class="string">'🐸',class="string">'🦊',class="string">'🐯',class="string">'🐷',class="string">'🐮',class="string">'🐵',class="string">'🐔',class="string">'🐧',class="string">'🦄',class="string">'🐴',class="string">'🦁',class="string">'🐻',class="string">'🐨',class="string">'🐲',class="string">'🦋',class="string">'🐝',class="string">'🦀',class="string">'🐙',class="string">'🦑',class="string">'🐬'];
37class=class="string">"keyword">var cols=class="number">4,rows=class="number">3,cards=[],flipped=[],matched=[],moves=class="number">0,locked=false;
38class=class="string">"keyword">function setSize(d){
39 class=class="string">"keyword">var btns=document.querySelectorAll(class="string">'.btn-diff');
40 btns.forEach(class=class="string">"keyword">function(b,i){b.className=class="string">'btn btn-diff'+(i===d?class="string">' active':class="string">'')});
41 class=class="string">"keyword">if(d===class="number">0){cols=class="number">4;rows=class="number">3}class=class="string">"keyword">else class=class="string">"keyword">if(d===class="number">1){cols=class="number">4;rows=class="number">4}class=class="string">"keyword">else{cols=class="number">6;rows=class="number">4}
42 startGame();}
43class=class="string">"keyword">function startGame(){
44 class=class="string">"keyword">var total=cols*rows;class=class="string">"keyword">if(total%class="number">2!==class="number">0)total=cols*rows;
45 class=class="string">"keyword">var pairs=total/class="number">2;
46 cards=[];flipped=[];matched=[];moves=class="number">0;locked=false;
47 document.class="func">getElementById(class="string">'moves').textContent=class="string">'class="number">0';
48 document.class="func">getElementById(class="string">'totalPairs').textContent=pairs;
49 document.class="func">getElementById(class="string">'pairs').textContent=class="string">'class="number">0';
50 class=class="string">"keyword">var used=[];class=class="string">"keyword">for(class=class="string">"keyword">var i=class="number">0;i<class="tag">pairs;i++){
51 class=class="string">"keyword">var idx=i%emojis.length;used.push(emojis[idx]);used.push(emojis[idx]);}
52 class=class="string">"keyword">for(class=class="string">"keyword">var i=used.length-class="number">1;i>class="number">0;i--){class=class="string">"keyword">var j=Math.floor(Math.random()*(i+class="number">1));class=class="string">"keyword">var t=used[i];used[i]=used[j];used[j]=t;}
53 cards=used;render();}
54class=class="string">"keyword">function render(){
55 class=class="string">"keyword">var b=document.class="func">getElementById(class="string">'board');
56 b.style.gridTemplateColumns=class="string">'repeat('+cols+class="string">',64px)';
57 b.innerHTML=class="string">'';
58 class=class="string">"keyword">for(class=class="string">"keyword">var i=class="number">0;i<class="tag">cards.length;i++){
59 class=class="string">"keyword">var d=document.createElement(class="string">'div');d.className=class="string">'card hidden';
60 d.dataset.idx=i;
61 d.class="func">addEventListener(class="string">'click',class=class="string">"keyword">function(idx){class=class="string">"keyword">return class=class="string">"keyword">function(){flipCard(idx)}}(i));
62 b.appendChild(d);}
63}
64class=class="string">"keyword">function flipCard(idx){
65 class=class="string">"keyword">if(locked||flipped.length>=class="number">2||matched[idx]||flipped.includes(idx))class=class="string">"keyword">return;
66 class=class="string">"keyword">var cards=document.querySelectorAll(class="string">'.card');
67 cards[idx].classList.remove(class="string">'hidden');cards[idx].classList.add(class="string">'selected');
68 cards[idx].textContent=class=class="string">"keyword">this.cards[idx];
69 flipped.push(idx);
70 class=class="string">"keyword">if(flipped.length===class="number">2){
71 moves++;document.class="func">getElementById(class="string">'moves').textContent=moves;locked=true;
72 class=class="string">"keyword">if(cards[flipped[class="number">0]].textContent===cards[flipped[class="number">1]].textContent&&flipped[class="number">0]!==flipped[class="number">1]){
73 matched[flipped[class="number">0]]=true;matched[flipped[class="number">1]]=true;
74 cards[flipped[class="number">0]].classList.remove(class="string">'selected');cards[flipped[class="number">0]].classList.add(class="string">'matched');
75 cards[flipped[class="number">1]].classList.remove(class="string">'selected');cards[flipped[class="number">1]].classList.add(class="string">'matched');
76 class=class="string">"keyword">var p=class="number">0;class=class="string">"keyword">for(class=class="string">"keyword">var i=class="number">0;i<class="tag">matched.length;i++)class=class="string">"keyword">if(matched[i])p++;
77 document.class="func">getElementById(class="string">'pairs').textContent=p/class="number">2;
78 flipped=[];locked=false;
79 class=class="string">"keyword">if(matched.filter(Boolean).length===cards.length)
80 class="func">setTimeout(class=class="string">"keyword">function(){class="func">alert(class="string">'🎉 你赢了!用了'+moves+class="string">'步')},class="number">300);
81 }class=class="string">"keyword">else{
82 class=class="string">"keyword">var cards2=cards;
83 class="func">setTimeout(class=class="string">"keyword">function(){
84 cards2[flipped[class="number">0]].classList.add(class="string">'hidden');cards2[flipped[class="number">0]].classList.remove(class="string">'selected');cards2[flipped[class="number">0]].textContent=class="string">'';
85 cards2[flipped[class="number">1]].classList.add(class="string">'hidden');cards2[flipped[class="number">1]].classList.remove(class="string">'selected');cards2[flipped[class="number">1]].textContent=class="string">'';
86 flipped=[];locked=false;
87 },class="number">800);}
88 }
89}
90startGame();
91</class="tag">script><class="tag">div style="text-align:center;padding-top:10px;font-size:12px;color:class=class="string">"keyword">class=class="string">"comment">#class="number">555"><class="tag">a href="source-viewer.php?file=game-memory.php" style="color:#FF6B35;text-decoration:none;">📖 查看源码</class="tag">a> · 编程小白,AI生成,若体验不佳请多包涵 🙏</class="tag">div>
92</class="tag">body></class="tag">html>
93

Warning: Cannot modify header information - headers already sent by (output started at /www/wwwroot/273059_cn/tools/source-viewer.php:69) in /www/wwwroot/273059_cn/tools/source-viewer.php on line 72

Warning: Cannot modify header information - headers already sent by (output started at /www/wwwroot/273059_cn/tools/source-viewer.php:69) in /www/wwwroot/273059_cn/tools/source-viewer.php on line 73
记忆翻牌 - η空间

🧠 记忆翻牌

🧠 点击翻开卡片,记住位置,配对相同图案。全部配对齐获胜!

步数 0配对 0/6
📖 查看源码 · 编程小白,AI生成,若体验不佳请多包涵 🙏