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

No:51474

137

←

Prev Next

→

Simulator
Developer User21536｜Date and time 24/3/12 13:34:41
Build time 8.998 sec｜Game capacity 2.554KB｜

Script

Welcome to the Pictogram Puzzle Game!

Arrange the pictograms in the correct order to solve the puzzle.

←

Prev　Next

→ 　

Back　

[PR]現在の人気グッズランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>Pictogram Puzzle Game</title>
</head>
<body>
    <div>
        <h1>Welcome to the Pictogram Puzzle Game!</h1>
        <p>Arrange the pictograms in the correct order to solve the puzzle.</p>
        <div id="puzzle">
            <img src="pictogram1.png" id="pictogram1" draggable="true" ondragstart="drag(event)">
            <img src="pictogram2.png" id="pictogram2" draggable="true" ondragstart="drag(event)">
            <img src="pictogram3.png" id="pictogram3" draggable="true" ondragstart="drag(event)">
            
        </div>
        <div id="solution">
            <img src="solution1.png" id="solution1" ondrop="drop(event)" ondragover="allowDrop(event)">
            <img src="solution2.png" id="solution2" ondrop="drop(event)" ondragover="allowDrop(event)">
            <img src="solution3.png" id="solution3" ondrop="drop(event)" ondragover="allowDrop(event)">
            
        </div>
        <button onclick="checkSolution()">Check Solution</button>
        <p id="result"></p>
    </div>
    <script>
        function drag(event) {
            event.dataTransfer.setData("text", event.target.id);
        }

function allowDrop(event) {
            event.preventDefault();
        }

function drop(event) {
            event.preventDefault();
            var data = event.dataTransfer.getData("text");
            event.target.appendChild(document.getElementById(data));
        }

function checkSolution() {
            var solutionCheck = true;

// Check if pictograms are in correct order
            var solutionOrder = ["solution1", "solution2", "solution3"]; // Update this with correct solution order
            for (var i = 0; i < solutionOrder.length; i++) {
                if (document.getElementById(solutionOrder[i]).children.length === 0) {
                    solutionCheck = false;
                    break;
                }
                if (document.getElementById(solutionOrder[i]).children[0].id !== ("pictogram" + (i + 1))) {
                    solutionCheck = false;
                    break;
                }
            }

// Display result
            if (solutionCheck) {
                document.getElementById("result").innerHTML = "Congratulations! Puzzle solved!";
            } else {
                document.getElementById("result").innerHTML = "Incorrect solution. Try again!";
            }
        }
    </script>
</body>
</html>