wancheng

matching-game.html

@@ -97,7 +97,7 @@
             background-color: rgba(42, 42, 42, 0.8);
             border: 2px solid var(--secondary-color);
             border-radius: 10px;
-            max-width: 500px;
+            max-width: 1000px;
             transition: all 0.3s ease;
         }
 
@@ -110,8 +110,8 @@
 
         .sinner-image-wrapper {
             position: relative;
-            width: 200px;
-            height: 200px;
+            width: 400px;
+            height: 600px;
             border-radius: 10px;
             overflow: hidden;
             border: 1px solid rgba(255, 215, 0, 0.3);
@@ -127,19 +127,19 @@
         .sinner-image {
             width: 100%;
             height: 100%;
-            object-fit: cover;
+            object-fit: contain;
         }
 
         .ego-image-wrapper {
             position: relative;
-            width: 200px;
-            height: 200px;
+            width: 400px;
+            height: 600px;
             border-radius: 10px;
             overflow: hidden;
             border: 1px solid rgba(255, 215, 0, 0.3);
             transition: all 0.3s ease;
             cursor: pointer;
-            opacity: 0.5;
+            opacity: 0;
         }
 
         .ego-image-wrapper:hover {
@@ -450,19 +450,19 @@
 
 <script>
     // 游戏数据
-    const gameData = [
-        { id: 1, sinner: "浮士德", source: "《浮士德》" },
-        { id: 2, sinner: "但丁", source: "《神曲》" },
-        { id: 3, sinner: "良秀", source: "《地狱变》" },
-        { id: 4, sinner: "默尔索", source: "《局外人》" },
-        { id: 5, sinner: "鸿璐", source: "《红楼梦》" },
-        { id: 6, sinner: "希斯克利夫", source: "《呼啸山庄》" },
-        { id: 7, sinner: "以实玛利", source: "《白鲸》" },
-        { id: 8, sinner: "罗佳", source: "《罪与罚》" },
-        { id: 9, sinner: "辛克莱", source: "《德米安》" },
-        { id: 10, sinner: "奥提斯", source: "《奥提斯》" },
-        { id: 11, sinner: "格里高尔", source: "《变形记》" },
-        { id: 12, sinner: "堂吉诃德", source: "《堂吉诃德》" }
+        const gameData = [
+        { id: 2, sinner: "浮士德", source: "《浮士德》", imgName: "faust", egoImgName: "faust_ego" },
+        { id: 3, sinner: "堂吉诃德", source: "《堂吉诃德》", imgName: "don_quixote", egoImgName: "don_quixote_ego" },
+        { id: 4, sinner: "良秀", source: "《地狱变》", imgName: "yoshihide", egoImgName: "yoshihide_ego" },
+        { id: 5, sinner: "默尔索", source: "《局外人》", imgName: "meursault", egoImgName: "meursault_ego" },
+        { id: 6, sinner: "鸿璐", source: "《红楼梦》", imgName: "honglu", egoImgName: "honglu_ego" },
+        { id: 7, sinner: "希斯克利夫", source: "《呼啸山庄》", imgName: "heathcliff", egoImgName: "heathcliff_ego" },
+        { id: 8, sinner: "以实玛利", source: "《白鲸》", imgName: "ishmael", egoImgName: "ishmael_ego" },
+        { id: 9, sinner: "罗佳", source: "《罪与罚》", imgName: "rodya", egoImgName: "rodya_ego" },
+        { id: 10, sinner: "但丁", source: "《神曲》", imgName: "dante", egoImgName: "dante_ego" },
+        { id: 11, sinner: "辛克莱", source: "《德米安》", imgName: "sinclair", egoImgName: "sinclair_ego" },
+        { id: 12, sinner: "奥提斯", source: "《奥德修斯》", imgName: "outis", egoImgName: "outis_ego" },
+        { id: 13, sinner: "格里高尔", source: "《变形记》", imgName: "gregor", egoImgName: "gregor_ego" },
     ];
 
     // 游戏状态
@@ -502,13 +502,13 @@
 
         // 根据罪人名字构建图片路径，假设图片在images目录下
         // 使用罪人名字作为文件名，支持常见图片格式
-        const imageExtensions = ['.jpg', '.jpeg', '.png', '.gif', '.webp'];
+        const imageExtensions = ['.png'];
         let sinnerImageLoaded = false;
         let egoImageLoaded = false;
 
         // 尝试加载罪人立绘
         for (const ext of imageExtensions) {
-            const imagePath = `images/sinners/${sinner.sinner}${ext}`;
+            const imagePath = `images/sinners/${sinner.imgName}${ext}`;
             sinnerImage.src = imagePath;
 
             // 检查图片是否可以加载
@@ -533,7 +533,7 @@
 
         // 尝试加载Ego立绘
         for (const ext of imageExtensions) {
-            const egoPath = `images/egos/${sinner.sinner}${ext}`;
+            const egoPath = `images/egos/${sinner.egoImgName}${ext}`;
             egoImage.src = egoPath;
 
             // 检查图片是否可以加载
@@ -557,11 +557,11 @@
         }
 
         // 重置Ego图片的透明度
-        egoImageWrapper.style.opacity = '0.5';
+        egoImageWrapper.style.opacity = '0';
 
         // 添加点击事件显示Ego立绘
         egoImageWrapper.onclick = function() {
-            egoImageWrapper.style.opacity = egoImageWrapper.style.opacity === '0.5' ? '1' : '0.5';
+            egoImageWrapper.style.opacity = egoImageWrapper.style.opacity === '0' ? '1' : '0';
         };
     }
 
@@ -631,6 +631,8 @@
         if (currentSinnerIndex < shuffledSinners.length) {
             displaySinner();
             document.getElementById('next-btn').disabled = true;
+
+            document.querySelector('.ego-image-wrapper').style.opacity = '0';
         } else {
             // 所有罪人已匹配完成，显示结果
             showResults();
@@ -666,7 +668,7 @@
             resultImages.className = 'result-images';
 
             // 尝试加载罪人立绘
-            const imageExtensions = ['.jpg', '.jpeg', '.png', '.gif', '.webp'];
+            const imageExtensions = ['.png'];
             let sinnerImageFound = false;
 
             for (const ext of imageExtensions) {