動くネズミを動く猫が追いかけてる。's game

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

No:47787

111

←

Prev Next

→

動くネズミを動く猫が追いかけてる。
Developer User20650｜Date and time 24/2/29 21:27:57
Build time 8.026 sec｜Game capacity 1.905KB｜

Script

🐭

😺

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋Kindle本ランキング

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

<!DOCTYPE html>
<html>
<head>
<title>Mouse and Cat Game</title>
<style>
    body {
        margin: 0;
        overflow: hidden;
    }
    #mouse {
        width: 50px;
        height: 50px;
        position: absolute;
    }
    #cat {
        width: 50px;
        height: 50px;
        position: absolute;
    }
</style>
</head>
<body>

const speed = 3;

let mouseX = Math.random() * window.innerWidth;
    let mouseY = Math.random() * window.innerHeight;

let catX = Math.random() * window.innerWidth;
    let catY = Math.random() * window.innerHeight;

document.addEventListener('mousemove', (e) => {
        mouseX = e.clientX;
        mouseY = e.clientY;
    });

function update() {
        const dx = mouseX - mouse.offsetLeft;
        const dy = mouseY - mouse.offsetTop;

const distance = Math.hypot(dx, dy);

if (distance > speed) {
            const angle = Math.atan2(dy, dx);
            mouse.style.left = `${mouse.offsetLeft + speed * Math.cos(angle)}px`;
            mouse.style.top = `${mouse.offsetTop + speed * Math.sin(angle)}px`;
        }

const catDx = mouse.offsetLeft - cat.offsetLeft;
        const catDy = mouse.offsetTop - cat.offsetTop;

const catDistance = Math.hypot(catDx, catDy);

if (catDistance > speed) {
            const catAngle = Math.atan2(catDy, catDx);
            cat.style.left = `${cat.offsetLeft + speed * Math.cos(catAngle)}px`;
            cat.style.top = `${cat.offsetTop + speed * Math.sin(catAngle)}px`;
        }

if (distance < 10) {
            alert('Game Over! The cat caught the mouse.');
            location.reload();
        }

requestAnimationFrame(update);
    }

update();
</script>

</body>
</html>