Warning: count(): Parameter must be an array or an object that implements Countable in /home/yukuri/crypto-app.tokyo/public_html/AIGameCreator/Com0.php on line 157

Warning: in_array() expects parameter 2 to be array, bool given in /home/yukuri/crypto-app.tokyo/public_html/AIGameCreator/Com0.php on line 476

Warning: count(): Parameter must be an array or an object that implements Countable in /home/yukuri/crypto-app.tokyo/public_html/AIGameCreator/Com0.php on line 484
Table tennis using 🥺 as a ball's game | AI game creator

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

No:168

620

←

Prev Next

→

Table tennis using 🥺 as a ball
Developer User2753｜Date and time 23/6/1 15:20:12
Build time 166.913 sec｜Game capacity 3.142KB｜

Script

🥺table tennis🏓

Tilt your phone.🥺as a racket.、Lets return the ball!

*Program Description: The degree to which the phone is tilted.🥺the movement of、The ball also moves to follow it. The ball is reflected when it hits the edge of the screen. The ball is located in the upper part of the🥺The reflection occurs when it hits the

←

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>🥺テーブルテニス🏓</title>
	<style>
		body {
			text-align: center;
		}
		table {
			margin: 0 auto;
			border-collapse: collapse;
			border: 3px solid black;
		}
		td {
			height: 80px;
			width: 80px;
			background-color: #87CEFA;
			border: 1px solid black;
			text-align: center;
			font-size: 40px;
		}
		#ball {
			background-color: #FFC0CB;
			animation: move 1s linear infinite;
		}
		@keyframes move {
			0% { transform: translate(0, 0); }
			25% { transform: translate(250px, 0); }
			50% { transform: translate(250px, 400px); }
			75% { transform: translate(0, 400px); }
			100% { transform: translate(0, 0); }
		}
	</style>
	<script>
		window.addEventListener("deviceorientation", handleOrientation);
		var ballX = 0;
		var ballY = 0;
		var ballSpeedX = 5;
		var ballSpeedY = 5;
		function handleOrientation(event) {
			var x = event.gamma; // range from -90 to 90
			ballX += x * 2;
			ballY += ballSpeedY;
			if (ballX < 0) {
				ballX = 0;
				ballSpeedX = -ballSpeedX;
			}
			if (ballX > 280) {
				ballX = 280;
				ballSpeedX = -ballSpeedX;
			}
			if (ballY < 0) {
				ballY = 0;
				ballSpeedY = -ballSpeedY;
			}
			if (ballY > 360) {
				ballY = 360;
				ballSpeedY = -ballSpeedY;
			}
			document.getElementById("ball").style.transform = "translate(" + ballX + "px, " + ballY + "px)";
		}
	</script>
</head>
<body>
	<h1>🥺テーブルテニス🏓</h1>
	<p>スマホを傾けて🥺をラケット代わりにして、ボールを返そう！</p>
	<table>
		<tr>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
		</tr>
		<tr>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td id="ball" colspan="2" rowspan="2"></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
		</tr>
		<tr>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
		</tr>
		<tr>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
		</tr>
		<tr>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
		</tr>
		<tr>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
		</tr>
		<tr>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
		</tr>
		<tr>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
		</tr>
		<tr>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
			<td></td>
		</tr>
	</table>
</body>
</html>

※プログラムの説明：
・スマホを傾ける度合いで🥺が動き、それに追随するようにボールも動く。
・ボールは画面端に当たると反射する。
・ボールは上部の🥺に当たると反射する。