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

No:2549

1254

←

Prev Next

→

Throwing a dog a bone to make him miss you
Developer User3578｜Date and time 23/6/21 23:00:45
Build time 24.856 sec｜Game capacity 1.95KB｜

Script

というゲームを作りました。

犬に骨を投げて懐かせるゲーム

←

Prev　Next

→ 　

Back　

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

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;
			font-size: 2em;
		}
		button {
			font-size: 1.5em;
			padding: 1em;
			margin: 1em;
			border-radius: 1em;
			background-color: yellowgreen;
			color: white;
			text-shadow: 1px 1px black;
			box-shadow: 3px 3px 5px lightgray;
			cursor: pointer;
		}
		img {
			height: 10em;
			margin: 2em;
		}
		#bone {
			position: absolute;
			left: 50%;
			top: 50%;
			transform: translate(-50%, -50%);
			animation: throw 2s;
			pointer-events: none;
		}
		@keyframes throw {
			0% {
				transform: translate(-50%, -50%) rotate(-10deg);
			}
			50% {
				transform: translate(-50%, -50%) rotate(90deg);
			}
			100% {
				transform: translate(-50%, -50%) rotate(-10deg);
			}
		}
	</style>
	<script>
		let dog = document.createElement('img');
		dog.src = '🐶';
		document.body.appendChild(dog);

let bone = document.createElement('img');
		bone.src = '🦴';
		bone.id = 'bone';
		document.body.appendChild(bone);

bone.addEventListener('click', throwBone);
	</script>
</head>
<body>
	<h1>犬に骨を投げて懐かせるゲーム</h1>
	<button onclick="throwBone()">骨投げ</button>
</body>
</html>