スライドパズル's game

Click here for free DL of the app version that can save data.

No:31040

←

Prev Next

→

スライドパズル
Developer User14987｜Date and time 23/12/24 20:57:22
Build time 15.226 sec｜Game capacity 2.246KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋グッズランキング

Click here for free DL of the app version that can save data.

<!DOCTYPE html>
<html>
  <head>
    <title>スライドパズル</title>
    <style>
      .puzzle {
        width: 300px;
        height: 300px;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: repeat(3, 1fr);
      }

.cell {
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 36px;
        background-color: #eee;
        cursor: pointer;
      }
    </style>
  </head>
  <body>
    <div class="puzzle">
      <div class="cell" id="cell1">1</div>
      <div class="cell" id="cell2">2</div>
      <div class="cell" id="cell3">3</div>
      <div class="cell" id="cell4">4</div>
      <div class="cell" id="cell5">5</div>
      <div class="cell" id="cell6">6</div>
      <div class="cell" id="cell7">7</div>
      <div class="cell" id="cell8">8</div>
      <div class="cell" id="cell9"></div>
    </div>

cells.forEach((cell) => {
          cell.addEventListener("click", function () {
            if (isAdjacent(cell, emptyCell)) {
              swapCells(cell, emptyCell);
              if (isInOrder(cells)) {
                alert("Congratulations! You won!");
              }
            }
          });
        });

function isAdjacent(cell1, cell2) {
          const rect1 = cell1.getBoundingClientRect();
          const rect2 = cell2.getBoundingClientRect();

const dx = rect1.x - rect2.x;
          const dy = rect1.y - rect2.y;

return (
            (dx === 0 && Math.abs(dy) === rect1.height) ||
            (dy === 0 && Math.abs(dx) === rect1.width)
          );
        }

function swapCells(cell1, cell2) {
          const temp = cell1.innerHTML;
          cell1.innerHTML = cell2.innerHTML;
          cell2.innerHTML = temp;
        }