Stars When you tap the screen, a star mark is drawn by JavaScript at the tapped position. Tap various places and create your own starry sky!'s game

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

No:2318

3462

←

Prev Next

→

Stars When you tap the screen, a star mark is draw..ALL
Developer anonymous｜Date and time 70/1/1 9:23:57
Build time unknown sec｜Game capacity 1.437KB｜

Script

HTMLファイル:

概要: - 画面をタップすると星マークが描かれます。 - ランダムな色が選ばれます。 - 線の幅は2に設定されています。 - 星マークは8本の線で構成されています。 - スマホで操作する場合も動作します。

←

Prev　Next

→ 　

Back　

[PR]現在のプレゼントランキング

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

HTMLファイル:

```html
<!doctype html>
<html>
<head>
	<meta charset="utf-8">
	<title>お星さま</title>
	<style>
		canvas {
			display: block;
			margin: 0 auto;
		}
	</style>
</head>

var colorArray = ['#FFCE33', '#F7A51F', '#F15A29', '#E91E63', '#9C27B0', '#673AB7', '#3F51B5', '#2196F3', '#03A9F4', '#00BCD4', '#009688', '#4CB648'];

canvas.width = window.innerWidth;
		canvas.height = window.innerHeight;

canvas.addEventListener("click", function(event) {
			drawStar(event.clientX, event.clientY);
		});

function drawStar(x, y) {
			ctx.lineWidth = 2;
			ctx.strokeStyle = colorArray[getRandomInt(0, colorArray.length)];
			ctx.beginPath();
			ctx.moveTo(x, y-15);
			ctx.lineTo(x+8, y-5);
			ctx.lineTo(x+15, y);
			ctx.lineTo(x+8, y+5);
			ctx.lineTo(x, y+15);
			ctx.lineTo(x-8, y+5);
			ctx.lineTo(x-15, y);
			ctx.lineTo(x-8, y-5);
			ctx.closePath();
			ctx.stroke();
		}

function getRandomInt(min, max) {
			return Math.floor(Math.random() * (max - min)) + min;
		}
	</script>
</body>
</html>
```

概要:

- 画面をタップすると星マークが描かれます。
- ランダムな色が選ばれます。
- 線の幅は2に設定されています。
- 星マークは8本の線で構成されています。
- スマホで操作する場合も動作します。