NumGuessingGame/index.html at main · Learnerbypassion/NumGuessingGame · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>NumGussing Game</title>
    <link rel="stylesheet" href="style.css">
</head>

<body>
    <div id="rulesScreen" onclick="startGame()">
        <h2>📜 Game Rules</h2>
        <p>
            Welcome to the Number Guessing Game!<br>
            - Guess the correct number which is selected by the computer <br>
            - The number is between 1-100.<br>
            - You’ll get hints after each guess.<br><br>
            Tap anywhere or click the button below to start!
        </p>
        <button id="startBtn" onclick="startGame(event)">Start Game</button>
    </div>
    <canvas id="starCanvas"></canvas>
    <div id="main" style="display: none;">
        <div class="gamebox">
            <div class="input">
                <input type="number" id="number" placeholder="">
            </div>
            <div class="output">
                <div class="hint" id="msg">
                    <p></p>
                </div>
            </div>
            <div class="numbers">
                <button class="numpad inPut btn">7</button>
                <button class="numpad inPut btn">8</button>
                <button class="numpad inPut btn">9</button>
                <button class="numpad inPut btn">4</button>
                <button class="numpad inPut btn">5</button>
                <button class="numpad inPut btn">6</button>
                <button class="numpad inPut btn">1</button>
                <button class="numpad inPut btn">2</button>
                <button class="numpad inPut btn">3</button>
                <button class="numpad inPut btn" id="undo-btn"><img
                        src="https://static.vecteezy.com/system/resources/previews/019/858/320/non_2x/backspace-flat-color-outline-icon-free-png.png"
                        alt="" class="switch"></button>
                <button class="numpad inPut btn">0</button>

                <button type="submit" class="numpad btn" onclick="input()"><img
                        src="https://png.pngtree.com/png-vector/20230330/ourmid/pngtree-click-the-submit-icon-button-vector-png-image_6674608.png"
                        alt="" class="switch" id="submit"></button>
            </div>
        </div>
    </div>
    <script src="script.js"></script>
</body>
</html>