AI game creator

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

No:3557

5896

←

Prev Next

→

billiards
Developer User3655｜Date and time 23/6/25 15:14:33
Build time 23.186 sec｜Game capacity 2.192KB｜

Script

スマホで遊べるビリヤードゲームを実装します。以下が実装したプログラムになります。

このプログラムでは、画面いっぱいに広がるビリヤード台と、真ん中に置かれたビリヤードの球が表示されます。球は画面内を跳ね回り、画面端にぶつかると跳ね返ります。球は速度を変更することもできます。速度については、speedXとspeedYという変数で設定しています。また、球の画像にはビリヤードの絵文字を使用しています。このプログラムは、スマホでもプレイ可能であり、スマホで縦に画面を持っている状態でプレイすることができます。以上が、スマホで遊べるビリヤードゲームの実装になります。

←

Prev　Next

→ 　

Back　

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

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

スマホで遊べるビリヤードゲームを実装します。

以下が実装したプログラムになります。

```
<!DOCTYPE html>
<html>
<head>
	<title>スマホビリヤードゲーム</title>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<style>
		#table {
			position: relative;
			width: 100%;
			height: 80%;
			background-color: darkgreen;
			border-radius: 10px;
		}
		
		#ball {
			position: absolute;
			width: 30px;
			height: 30px;
			background-image: url('https://emojipedia-us.s3.dualstack.us-west-1.amazonaws.com/thumbs/240/apple/237/billiards_1f3b1.png');
			background-size: contain;
			background-repeat: no-repeat;
			background-position: center;
			border-radius: 50%;
			top: 40%;
			left: 50%;
			transform: translate(-50%, -50%);
		}
	</style>
</head>
<body>
	<div id="table"></div>
	<div id="ball"></div>

このプログラムでは、画面いっぱいに広がるビリヤード台と、真ん中に置かれたビリヤードの球が表示されます。球は画面内を跳ね回り、画面端にぶつかると跳ね返ります。

球は速度を変更することもできます。速度については、speedXとspeedYという変数で設定しています。

また、球の画像にはビリヤードの絵文字を使用しています。

このプログラムは、スマホでもプレイ可能であり、スマホで縦に画面を持っている状態でプレイすることができます。

以上が、スマホで遊べるビリヤードゲームの実装になります。