Update index.html

index.html

@@ -7,14 +7,13 @@
         body {
             margin: 0;
             overflow: hidden;
-            background: url('back1.webp') repeat;  /* 배경 이미지 타일형태로 설정 */
-            background-size: auto;  /* 원본 크기 유지 */
+            background: url('back1.webp') repeat;
+            background-size: auto;
             font-family: Arial, sans-serif;
             cursor: crosshair;
-            image-rendering: pixelated;  /* 픽셀 이미지 선명도 유지 */
+            image-rendering: pixelated;
         }
         
-        /* 배경 이미지 위에 어두운 오버레이 추가 */
         body::before {
             content: '';
             position: fixed;
@@ -22,8 +21,8 @@
             left: 0;
             width: 100%;
             height: 100%;
-            background: rgba(0, 0, 0, 0.3);  /* 어두운 오버레이 */
-            pointer-events: none;  /* 마우스 이벤트 통과 */
+            background: rgba(0, 0, 0, 0.3);
+            pointer-events: none;
             z-index: 1;
         }
         
@@ -128,9 +127,10 @@
             position: absolute;
             width: 40px;
             height: 40px;
-            background: #8B0000;
-            border-radius: 50%;
+            background: url('zom1.webp') no-repeat center center;
+            background-size: cover;
             z-index: 80;
+            transform-origin: center;
         }
         
         .explosion {
@@ -347,6 +347,7 @@
                 zombie.y += Math.sin(angle) * zombie.speed;
                 zombie.element.style.left = `${zombie.x - 20}px`;
                 zombie.element.style.top = `${zombie.y - 20}px`;
+                zombie.element.style.transform = `rotate(${angle}rad)`;  // 좀비 회전
                 
                 const distToPlayer = Math.hypot(playerX - zombie.x, playerY - zombie.y);
                 if (distToPlayer < 40) {