I want to score a soccer ball from a corner kick on a soccer field.'s game

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

No:7705

1358

←

Prev Next

→

I want to score a soccer ball from a corner kick o..ALL
Developer o2pi4｜Date and time 23/7/9 13:35:36
Build time 13.438 sec｜Game capacity 3.789KB｜

Script

以下は、サッカーボールをコーナーキックからゴールに入れるゲームの例です。必要な処理や操作を実装しています。

⚽

このHTMLファイルをブラウザで開くと、画面下部にサッカーボールが表示されます。サッカーボールをタップすると、コーナーキックからゴールに向かってボールが移動します。ボールがゴール内に入ると、ゴールの背景が緑色に変わり、「Goal!」と表示されます。注意点として、ゴールの位置やサイズ、ボールの初期位置などは自由に設定できますが、スマホ画面に最適化するために調整が必要かもしれません。

←

Prev　Next

→ 　

Back　

[PR]現在のプレゼントランキング

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

以下は、サッカーボールをコーナーキックからゴールに入れるゲームの例です。必要な処理や操作を実装しています。

```html
<!DOCTYPE html>
<html>
<head>
    <title>Corner Kick Game</title>
    <style>
        #ball {
            position: absolute;
            width: 50px;
            height: 50px;
            background: black;
            border-radius: 50%;
            color: white;
            text-align: center;
            line-height: 50px;
            font-size: 24px;
        }
        
        #goal {
            position: absolute;
            top: 200px;
            right: 50px;
            width: 100px;
            height: 200px;
            background: yellow;
        }
    </style>
</head>
<body>
    <div id="ball">⚽</div>
    <div id="goal"></div>

ball.style.left = startX + "px";
        ball.style.top = startY + "px";

ball.addEventListener("click", function() {
            if (!isMoving && !goalScored) {
                isMoving = true;
                startMoving();
            }
        });

function startMoving() {
            var targetX = window.innerWidth - 100; // 画面右端
            var targetY = (window.innerHeight / 2) - 25; // 画面中央に向かって進む

var distanceX = targetX - startX;
            var distanceY = targetY - startY;
            var distance = Math.sqrt((distanceX * distanceX) + (distanceY * distanceY)); // ピタゴラスの定理

var speed = 5; // 移動速度（ピクセル/フレーム）
            var duration = distance / speed; // 移動時間（フレーム数）

var velocityX = distanceX / duration;
            var velocityY = distanceY / duration;

moveBall(startX, startY, velocityX, velocityY, duration);
        }

function moveBall(x, y, vx, vy, duration) {
            if (duration <= 0) {
                isMoving = false;
                if (isInsideGoal(x, y)) {
                    goal.style.background = "green";
                    goalScored = true;
                }
                return;
            }

setTimeout(function() {
                x += vx;
                y += vy;
                duration--;

ball.style.left = x + "px";
                ball.style.top = y + "px";

moveBall(x, y, vx, vy, duration);
            }, 16.7); // 60fps (1000ms / 60 ≒ 16.7ms)
        }

function isInsideGoal(x, y) {
            var goalRect = goal.getBoundingClientRect();
            var ballRect = ball.getBoundingClientRect();

if (ballRect.right >= goalRect.left && ballRect.left <= goalRect.right &&
                ballRect.bottom >= goalRect.top && ballRect.top <= goalRect.bottom) {
                return true;
            }
            return false;
        }
    </script>
</body>
</html>
```