AI game creator

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

No:6639

←

Prev Next

→

Horror Novels
Developer User3907｜Date and time 23/7/3 0:54:13
Build time 54.675 sec｜Game capacity 6.478KB｜

Script

以下は、簡単なホラーノベルゲームの実装例です。以下のコードを1枚のHTMLファイルに記述してください。

このコードは、選択肢によってストーリーが進行するホラーノベルゲームです。少年が古ぼけた屋敷に迷い込み、プレイヤーは選択肢を選んでストーリーを進めていきます。選択肢によって異なる結末にたどり着くことができます。

←

Prev　Next

→ 　

Back　

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

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

以下は、簡単なホラーノベルゲームの実装例です。以下のコードを1枚のHTMLファイルに記述してください。

```html
<!DOCTYPE html>
<html>
<head>
    <title>ホラーノベルゲーム</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            margin: 0;
            padding: 2rem;
            display: flex;
            align-items: center;
            justify-content: center;
            height: 100vh;
            background-color: #000;
            color: #fff;
            text-align: center;
        }

#story {
            font-size: 24px;
            margin-bottom: 2rem;
        }

#choice-buttons {
            display: flex;
            align-items: center;
            justify-content: center;
            flex-wrap: wrap;
        }

.choice-button {
            font-size: 18px;
            margin: 0.5rem;
            padding: 1rem;
            border: none;
            border-radius: 4px;
            background-color: #fff;
            color: #000;
            cursor: pointer;
            transition: background-color 0.3s ease;
        }

.choice-button:hover {
            background-color: #ccc;
        }
    </style>
</head>
<body>
    <div id="story"></div>
    <div id="choice-buttons"></div>

const story = [
            {
                text: 'ある日、ひとりの少年が古ぼけた屋敷に迷い込んでしまった。',
                choices: [
                    {
                        text: '屋敷を探索する',
                        nextIndex: 1
                    },
                    {
                        text: 'さっさと逃げる',
                        nextIndex: 2
                    }
                ]
            },
            {
                text: '屋敷の廊下を進んでいると、ゴミのような臭いが漂ってきた。',
                choices: [
                    {
                        text: '臭いの原因を探る',
                        nextIndex: 3
                    },
                    {
                        text: '逃げる',
                        nextIndex: 4
                    }
                ]
            },
            {
                text: '少年は逃げ出すことにしたが、扉が開かない。',
                choices: [
                    {
                        text: '必死にドアを開ける',
                        nextIndex: 5
                    },
                    {
                        text: '助けを待つ',
                        nextIndex: 6
                    }
                ]
            },
            {
                text: '少年は部屋に入ると、死体が転がっていた。',
                choices: [
                    {
                        text: '悲鳴を上げる',
                        nextIndex: 7
                    },
                    {
                        text: '気を取り直して探索する',
                        nextIndex: 8
                    }
                ]
            },
            {
                text: '少年の足元から怪物が現れ、襲いかかってきた。',
                choices: [
                    {
                        text: '必死に抵抗する',
                        nextIndex: 9
                    },
                    {
                        text: '絶望して叫ぶ',
                        nextIndex: 10
                    }
                ]
            },
            {
                text: 'ドアが開いた！少年は屋敷から脱出することに成功した。',
                choices: []
            },
            {
                text: '助けが来るまで部屋で待つことにしたが、全く音沙汰はなかった。',
                choices: []
            },
            {
                text: '少年は悲鳴を上げながら部屋から逃げ出した。',
                choices: []
            },
            {
                text: '少年は屋敷の奥へと進んでいくと、次第に暗くなっていった。',
                choices: [
                    {
                        text: '踏み迷う',
                        nextIndex: 11
                    },
                    {
                        text: '暗闇の中を進む',
                        nextIndex: 12
                    }
                ]
            },
            {
                text: '怪物との戦いの末、少年は力尽きてしまった。',
                choices: []
            },
            {
                text: '少年の叫び声が屋敷に響き渡り、「五日目の悪夢」という噂話になった。',
                choices: []
            },
            {
                text: '少年は真っ暗な闇の中から抜け出せなくなってしまった。',
                choices: []
            }
        ];

let storyIndex = 0;

function renderStory() {
            const currentStory = story[storyIndex];
            storyContainer.textContent = currentStory.text;

while (choiceButtonContainer.firstChild) {
                choiceButtonContainer.removeChild(choiceButtonContainer.firstChild);
            }

currentStory.choices.forEach((choice, index) => {
                const choiceButton = document.createElement('button');
                choiceButton.className = 'choice-button';
                choiceButton.textContent = choice.text;
                choiceButton.addEventListener('click', () => makeChoice(index));
                choiceButtonContainer.appendChild(choiceButton);
            });
        }

function makeChoice(choiceIndex) {
            const currentStory = story[storyIndex];
            storyIndex = currentStory.choices[choiceIndex].nextIndex;
            renderStory();
        }

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