AI game creator

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

No:2824

2033

←

Prev Next

→

🍷💥‼️
Developer User3589｜Date and time 23/6/22 20:22:04
Build time 27.735 sec｜Game capacity 2.269KB｜

Script

面倒なデプロイ作業を避けるため、HTMLファイル内にアプリを実装しました！JavaScriptも利用しているので、ブラウザで簡単に遊べます🎉 [🍷を💥‼️]というゲームを作ってみました！ルールは簡単。画面上にあるワイン🍷をタップすると、💥が発射されて壊れます。連続で壊した数がスコアになります。スマホで操作する場合は、画面をタップするだけでOKです。では、楽しくプレイしてください！🎮 以下がコードになります。

🍷

スコア：0

←

Prev　Next

→ 　

Back　

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

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

面倒なデプロイ作業を避けるため、HTMLファイル内にアプリを実装しました！JavaScriptも利用しているので、ブラウザで簡単に遊べます🎉

[🍷を💥‼️]というゲームを作ってみました！ルールは簡単。画面上にあるワイン🍷をタップすると、💥が発射されて壊れます。連続で壊した数がスコアになります。スマホで操作する場合は、画面をタップするだけでOKです。

では、楽しくプレイしてください！🎮

以下がコードになります。

```html
<!DOCTYPE html>
<html>
<head>
	<title>🍷を💥‼️</title>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<style>
		body {
			margin: 0;
			padding: 0;
			background-color: #F3E5AB;
		}

#wine {
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
			width: 100px;
			height: 100px;
			font-size: 80px;
			text-align: center;
			cursor: pointer;
		}

#wine:hover {
			opacity: 0.7;
		}

#score {
			position: fixed;
			top: 10px;
			right: 10px;
			font-size: 40px;
		}
	</style>
	<script>
		let score = 0;

const wine = document.getElementById('wine');
		const scoreBoard = document.getElementById('score');

function handleClick() {
			score++;
			scoreBoard.innerText = `スコア：${score}`;

// 💥を発射するアニメーション
			const explosion = document.createElement('div');
			explosion.innerText = '💥';
			explosion.style.position = 'absolute';
			explosion.style.top = `${Math.random() * 100}%`;
			explosion.style.left = `${Math.random() * 100}%`;
			explosion.style.fontSize = '120px';
			explosion.style.animation = 'explode .5s linear';

document.body.appendChild(explosion);

setTimeout(() => {
				explosion.remove();
			}, 500);
		}

wine.addEventListener('click', handleClick);
	</script>
</head>
<body>
	<div id="wine">🍷</div>
	<div id="score">スコア：0</div>