AI game creator

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

No:4993

422

←

Prev Next

→

Virtual Akihabara
Developer User3806｜Date and time 23/6/29 6:18:05
Build time 32.045 sec｜Game capacity 3.681KB｜

Script

了解しました。以下に、スマホで遊べるカードゲームの例を示します。このゲームは、一枚のHTMLファイルに実装されており、JavaScriptを含んでいます。

このゲームは、絵文字を使ったカードめくりゲームです。ゲームが始まると、画面にランダムに並べられたカードが表示されます。プレイヤーはカードをクリックして裏返し、マッチする絵文字を見つけることが目標です。全てのカードの絵文字がマッチすれば、ゲームクリアとなります。このプログラムは、スマートフォンでもプレイ可能です。画面サイズに合わせて自動的にレスポンシブに表示されます。

←

Prev　Next

→ 　

Back　

[PR]現在の新着人気ランキング

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

```html
<!DOCTYPE html>
<html>
<head>
    <title>カードゲーム</title>
    <style>
        #game-container {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            align-items: center;
            width: 100vw;
            height: 100vh;
        }

.card {
            width: 80px;
            height: 120px;
            margin: 10px;
            font-size: 48px;
            text-align: center;
            line-height: 120px;
            background-color: #efefef;
            border-radius: 10px;
            cursor: pointer;
        }
    </style>
</head>
<body>
    <div id="game-container"></div>

function createCard(emoji) {
            const cardElement = document.createElement("div");
            cardElement.classList.add("card");
            cardElement.textContent = emoji;
            cardElement.addEventListener("click", () => flipCard(cardElement));
            return cardElement;
        }

function shuffleArray(array) {
            for (let i = array.length - 1; i > 0; i--) {
                const j = Math.floor(Math.random() * (i + 1));
                [array[i], array[j]] = [array[j], array[i]];
            }
        }

function initializeGame() {
            const gameContainer = document.getElementById("game-container");
            const shuffledEmojis = [...emojis, ...emojis];
            shuffleArray(shuffledEmojis);

for (let i = 0; i < shuffledEmojis.length; i++) {
                const cardElement = createCard(shuffledEmojis[i]);
                gameContainer.appendChild(cardElement);
            }
        }

initializeGame();
    </script>
</body>
</html>
```

このゲームは、絵文字を使ったカードめくりゲームです。ゲームが始まると、画面にランダムに並べられたカードが表示されます。プレイヤーはカードをクリックして裏返し、マッチする絵文字を見つけることが目標です。全てのカードの絵文字がマッチすれば、ゲームクリアとなります。

このプログラムは、スマートフォンでもプレイ可能です。画面サイズに合わせて自動的にレスポンシブに表示されます。