食べる鶏と熱いタバスコ's game | AI game creator

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

No:40018

39

食べる鶏と熱いタバスコ
Developer 食べる鶏と熱いタバスコ｜Date and time 24/1/31 18:27:37
Build time 19.556 sec｜Game capacity 4.423KB｜

では、以下に示すプログラムは、1枚のHTMLファイル内に実装され、JavaScriptも含みます。スマホでの操作を前提とし、絵文字も使用しています。これは、簡単な食べ物ゲームです。プレイヤーは熱いタバスコを食べる鶏を操作して、できるだけ多くのタバスコを食べることが目的です。

このプログラムでは、body要素の中に、プレイヤーの操作で移動する鶏の要素（div要素）と、動き回るタバスコの要素（div要素）を作成し、それぞれに絵文字を割り当て、画面上に表示しています。また、スコア表示のために、body要素の背景色をスコアに応じて変更するようにしています。プレイヤーはキーボードの上下左右キーで鶏を操作し、鶏がタバスコに当たるとスコアが増え、タバスコが別の位置にランダムに移動します。移動範囲は画面内に制限されており、スコアに応じて背景色が変化します。このプログラムを実行すると、ゲームが開始され、スマホで操作することができます。鶏がタバスコに当たるたびにスコアが増え、背景色が変わるので、できるだけ多くのタバスコを食べましょう。

→ 　

0　

0　

　
　
　
　

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

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

(C)2023 HisashiApp

では、以下に示すプログラムは、1枚のHTMLファイル内に実装され、JavaScriptも含みます。スマホでの操作を前提とし、絵文字も使用しています。これは、簡単な食べ物ゲームです。プレイヤーは熱いタバスコを食べる鶏を操作して、できるだけ多くのタバスコを食べることが目的です。

```html
<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>食べる鶏と熱いタバスコ</title>
    <style>
        body {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            margin: 0;
            font-size: 3rem;
        }
    </style>
</head>
<body>
    <script>
        const chicken = document.createElement('div');
        const hotSauce = document.createElement('div');
        let score = 0;

chicken.textContent = '🐔';
        hotSauce.textContent = '🌶️';

document.body.appendChild(chicken);
        document.body.appendChild(hotSauce);

chicken.style.position = 'absolute';
        hotSauce.style.position = 'absolute';

chicken.style.left = '50%';
        chicken.style.top = '50%';
        hotSauce.style.left = `${Math.random() * 100}%`;
        hotSauce.style.top = `${Math.random() * 100}%`;

const screenWidth = window.innerWidth;
        const screenHeight = window.innerHeight;

function updateScore() {
            document.body.style.background = `linear-gradient(to right, tomato ${score * 10}%, white ${score * 10}%)`;
        }

function checkCollision() {
            const chickenRect = chicken.getBoundingClientRect();
            const hotSauceRect = hotSauce.getBoundingClientRect();

if (
                chickenRect.top + chickenRect.height > hotSauceRect.top &&
                chickenRect.top < hotSauceRect.top + hotSauceRect.height &&
                chickenRect.left + chickenRect.width > hotSauceRect.left &&
                chickenRect.left < hotSauceRect.left + hotSauceRect.width
            ) {
                score++;
                hotSauce.style.left = `${Math.random() * 100}%`;
                hotSauce.style.top = `${Math.random() * 100}%`;
                updateScore();
            }
        }

function handleMovement(event) {
            const chickenRect = chicken.getBoundingClientRect();
            let newLeft = chickenRect.left;
            let newTop = chickenRect.top;

switch (event.key) {
                case 'ArrowUp':
                    newTop -= 10;
                    break;
                case 'ArrowDown':
                    newTop += 10;
                    break;
                case 'ArrowLeft':
                    newLeft -= 10;
                    break;
                case 'ArrowRight':
                    newLeft += 10;
                    break;
            }

if (newLeft >= 0 && newLeft + chickenRect.width <= screenWidth) {
                chicken.style.left = `${newLeft}px`;
            }

if (newTop >= 0 && newTop + chickenRect.height <= screenHeight) {
                chicken.style.top = `${newTop}px`;
            }

checkCollision();
        }

document.addEventListener('keydown', handleMovement);
        updateScore();
    </script>
</body>
</html>
```

このプログラムでは、body要素の中に、プレイヤーの操作で移動する鶏の要素（div要素）と、動き回るタバスコの要素（div要素）を作成し、それぞれに絵文字を割り当て、画面上に表示しています。また、スコア表示のために、body要素の背景色をスコアに応じて変更するようにしています。

プレイヤーはキーボードの上下左右キーで鶏を操作し、鶏がタバスコに当たるとスコアが増え、タバスコが別の位置にランダムに移動します。移動範囲は画面内に制限されており、スコアに応じて背景色が変化します。

このプログラムを実行すると、ゲームが開始され、スマホで操作することができます。鶏がタバスコに当たるたびにスコアが増え、背景色が変わるので、できるだけ多くのタバスコを食べましょう。