マリオみたいなアクションゲーム

以下はJavaScriptを使った簡単なマリオ風アクションゲームの実装例です。セキュリティの脆弱性に注意しつつ実装しました。

```html
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Mario Game</title>
    <style>
        #game-area{
            width: 500px;
            height: 400px;
            background-color: skyblue;
            position: relative;
        }
        #player{
            width: 50px;
            height: 50px;
            background-color: red;
            position: absolute;
            bottom: 0;
            left: 0;
        }
        .obstacle{
            width: 50px;
            height: 50px;
            background-color: brown;
            position: absolute;
            bottom: 0;
        }
        #obstacle1{
            left: 200px;
        }
        #obstacle2{
            left: 350px;
        }
    </style>
</head>
<body>
    <div id="game-area">
        <div id="player"></div>
        <div class="obstacle" id="obstacle1"></div>
        <div class="obstacle" id="obstacle2"></div>
    </div>
    <script>
        //キー入力判定
        document.addEventListener('keydown', function(event){
            if(event.keyCode == 37){
                moveLeft();
            }
            if(event.keyCode == 39){
                moveRight();
            }
            if(event.keyCode == 38){
                jump();
            }
        });

        //プレイヤーの移動
        function moveLeft(){
            var player = document.getElementById('player');
            var left = parseInt(player.style.left) || 0;
            left -= 10;
            if(left >= 0){
                player.style.left = left + 'px';
            }
        }
        function moveRight(){
            var player = document.getElementById('player');
            var left = parseInt(player.style.left) || 0;
            left += 10;
            if(left <= 450){
                player.style.left = left + 'px';
            }
        }

        //ジャンプ
        var isJumping = false;
        var jumpInterval;
        function jump(){
            if(!isJumping){
                var player = document.getElementById('player');
                var bottom = parseInt(player.style.bottom) || 0;
                var isGoingUp = true;
                jumpInterval = setInterval(function(){
                    bottom += isGoingUp ? 5 : -5;
                    if(bottom >= 200){
                        player.style.bottom = bottom + 'px';
                        isGoingUp = false;
                    }
                    if(bottom <= 0){
                        clearInterval(jumpInterval);
                        player.style.bottom = '0px';
                        isJumping = false;
                    }
                    player.style.bottom = bottom + 'px';
                }, 20);
                isJumping = true;
            }
        }

        //障害物との当たり判定
        setInterval(function(){
            var player = document.getElementById('player');
            var obstacle1 = document.getElementById('obstacle1');
            var obstacle2 = document.getElementById('obstacle2');
            if(isColliding(player, obstacle1) || isColliding(player, obstacle2)){
                window.showToast("再読み込みしてください"); //当たったらリセット
            }
        }, 50);

        //当たり判定
        function isColliding(el1, el2){
            var rect1 = el1.getBoundingClientRect();
            var rect2 = el2.getBoundingClientRect();
            return !(rect1.right < rect2.left || 
                     rect1.left > rect2.right || 
                     rect1.bottom < rect2.top || 
                     rect1.top > rect2.bottom);
        }
    </script>
</body>
</html>
```

ジョークは、障害物が「キノコ」と「クッパ」になっていることです。キノコは当たっても死にませんが、クッパに当たると死にます。