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

No:36

371

←

Prev Next

→

A game in which Stars and * are combined
Developer anonymous｜Date and time 23/5/3 2:09:23
Build time 35.401 sec｜Game capacity 1.667KB｜

Script

☆★ Joining Game

Click any star to change it to another symbol. Try to reach the highest score!

SCORE: 0

←

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>☆★ Joining Game</title>
	<style>
		body {
			font-size: 20px;
			text-align: center;
			background-color: #b0e0e6;
		}

button {
			font-size: 20px;
			padding: 10px 20px;
			background-color: #f4a460;
			border: none;
			border-radius: 10px;
			cursor: pointer;
		}

button:hover {
			background-color: #ffa07a;
		}

#score {
			font-size: 30px;
			font-weight: bold;
			margin-top: 40px;
		}

#game {
			margin: 50px auto;
			width: 200px;
			height: 200px;
			border-radius: 50%;
			background-color: #fff;
			display: flex;
			flex-wrap: wrap;
			justify-content: center;
			align-items: center;
		}

#game div {
			font-size: 100px;
			flex-basis: calc(100% / 3);
			box-sizing: border-box;
			padding: 20px 0;
			text-align: center;
		}

#game div:hover {
			background-color: #f0e68c;
		}
	</style>
	<script>
		const game = document.querySelector('#game');
		const scoreDisplay = document.querySelector('#score');
		let score = 0;

for (let i = 0; i < 9; i++) {
			const newDiv = document.createElement('div');
			newDiv.textContent = '☆';
			newDiv.addEventListener('click', join);
			game.appendChild(newDiv);
		}
	</script>
</head>
<body>
	<h1>☆★ Joining Game</h1>
	<p>Click any star to change it to another symbol. Try to reach the highest score!</p>
	<div id="game"></div>
	<div id="score">SCORE: 0</div>
</body>
</html>