A game that is a combination of Mario and Sonic.'s game

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

No:1795

3470

←

Prev Next

→

A game that is a combination of Mario and Sonic.
Developer anonymous｜Date and time 70/1/1 9:35:26
Build time unknown sec｜Game capacity 2.126KB｜

Script

Use arrow keys to move Mario and Sonic

このプログラムはマリオとソニックを動かして壁に当たると反転するという簡単なゲームです。上下左右の矢印キーを使って動かすことができます。絵文字を使って「Let's play! 😎💪」というメッセージを表示しても良いでしょう。

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋アプリランキング

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

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>Mario Sonic Game</title>
	<style type="text/css">
		body {
			background-color: #000;
			color: #fff;
			text-align: center;
			font-size: 28px;
			font-family: Arial, sans-serif;
		}
		canvas {
			border: 1px solid #fff;
			background-color: #66c2ff;
		}
	</style>
</head>
<body>
	<canvas id="gameCanvas" width="800" height="600"></canvas>
	<script type="text/javascript">
		var canvas = document.getElementById("gameCanvas");
		var ctx = canvas.getContext("2d");

// Load images
		var marioImage = new Image();
		marioImage.src = "mario.gif";
		var sonicImage = new Image();
		sonicImage.src = "sonic.gif";

// Set initial position and speed for Mario and Sonic
		var marioX = 50;
		var marioY = 50;
		var marioSpeedX = 5;
		var marioSpeedY = 5;
		var sonicX = 700;
		var sonicY = 50;
		var sonicSpeedX = -5;
		var sonicSpeedY = 5;

// Loop to animate game
		setInterval(function() {
			// Clear canvas
			ctx.clearRect(0, 0, canvas.width, canvas.height);

// Move Mario and Sonic
			marioX += marioSpeedX;
			marioY += marioSpeedY;
			sonicX += sonicSpeedX;
			sonicY += sonicSpeedY;

// Check for collisions with walls
			if (marioX + marioImage.width >= canvas.width || marioX <= 0) {
				marioSpeedX = -marioSpeedX;
			}
			if (marioY + marioImage.height >= canvas.height || marioY <= 0) {
				marioSpeedY = -marioSpeedY;
			}
			if (sonicX + sonicImage.width >= canvas.width || sonicX <= 0) {
				sonicSpeedX = -sonicSpeedX;
			}
			if (sonicY + sonicImage.height >= canvas.height || sonicY <= 0) {
				sonicSpeedY = -sonicSpeedY;
			}

// Draw images
			ctx.drawImage(marioImage, marioX, marioY);
			ctx.drawImage(sonicImage, sonicX, sonicY);

}, 30);

</script>
	<p>Use arrow keys to move Mario and Sonic</p>
</body>
</html>