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

No:1331

247

quiz game where one has to choose between right an..ALL
Developer User3025｜Date and time 23/6/18 11:11:39
Build time 54.664 sec｜Game capacity 5.821KB｜

quiz game where one has to choose between right and wrong

Do smart phones exist?

Answer: Yes

The right solution!

Not the right solution!

Is the moon square shaped?

Answer: none

The right solution!

Not the right solution!

Is Steve Jobs the founder of Apple Inc.

Answer: Yes

The right solution!

Not the right solution!

This app is a quiz with three questions.、Do Smartphones Exist? and Is the Moon Square? Is the moon square? Is Steve Jobs the founder of Apple Inc. The questions are Yes because smart phones exist. Yes because smart phones do exist.、None because the moon is not square shaped、And since the founder of Apple Inc. is Steve Jobs, the answer is Yes. Click on the button to see the answer.、The correct or incorrect answer is displayed and、Then proceed to the next question. After the last question is solved.、Scores are displayed and、You can play again. We dont use pictograms.、Since it is supposed to be operated with a smartphone、You can play by tapping buttons, etc.

→ 　

0　

0　

[PR]現在の売れ筋アプリランキング

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

(C)2023 HisashiApp

<!DOCTYPE html>
<html>
<head>
	<title>あるなしクイズ</title>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<style>
		body {
			background-color: #f2f2f2;
			font-family: Arial, sans-serif;
		}
		
		h1 {
			color: #ff6600;
			text-align: center;
		}
		
		.container {
			max-width: 600px;
			margin: auto;
			padding: 10px;
		}
		
		.question {
			background-color: #fff;
			padding: 20px;
			border-radius: 10px;
			box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1);
			margin-bottom: 20px;
			position: relative;
		}
		
		.question:after {
			content: "?";
			position: absolute;
			top: -10px;
			right: -10px;
			background-color: #ff6600;
			width: 30px;
			height: 30px;
			line-height: 30px;
			border-radius: 50%;
			color: #fff;
			text-align: center;
			font-size: 20px;
			box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
		}
		
		.answer {
			background-color: #fff;
			padding: 20px;
			border-radius: 10px;
			box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1);
			margin-bottom: 20px;
			display: none;
		}
		
		.correct {
			background-color: #00cc66;
			color: #fff;
			padding: 10px;
			border-radius: 5px;
			display: none;
		}
		
		.incorrect {
			background-color: #ff3333;
			color: #fff;
			padding: 10px;
			border-radius: 5px;
			display: none;
		}
		
		.result {
			background-color: #fff;
			padding: 20px;
			border-radius: 10px;
			box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1);
			margin-top: 20px;
			display: none;
		}
		
		.button {
			background-color: #ff6600;
			color: #fff;
			padding: 10px;
			border: none;
			border-radius: 5px;
			cursor: pointer;
			margin-top: 10px;
			width: 100%;
			font-size: 16px;
		}
		
		.hide {
			display: none;
		}
	</style>
</head>
<body>
	<div class="container">
		<h1>あるなしクイズ</h1>
		<div class="question">
			<p>スマートフォンは存在するか？</p>
			<button class="button check-answer">答えを見る</button>
			<div class="answer">
				<p>答え：あり</p>
				<div class="correct">
					<p>正解！</p>
				</div>
				<div class="incorrect">
					<p>不正解！</p>
				</div>
			</div>
		</div>
		<div class="question">
			<p>月は四角い形をしているか？</p>
			<button class="button check-answer">答えを見る</button>
			<div class="answer">
				<p>答え：なし</p>
				<div class="correct">
					<p>正解！</p>
				</div>
				<div class="incorrect">
					<p>不正解！</p>
				</div>
			</div>
		</div>
		<div class="question">
			<p>アップル社の創業者はスティーブ・ジョブズか？</p>
			<button class="button check-answer">答えを見る</button>
			<div class="answer">
				<p>答え：あり</p>
				<div class="correct">
					<p>正解！</p>
				</div>
				<div class="incorrect">
					<p>不正解！</p>
				</div>
			</div>
		</div>
		<div class="result">
			<p id="score"></p>
			<button class="button play-again">もう一度遊ぶ</button>
		</div>
	</div>
	<script>
		const questions = document.querySelectorAll(".question");
		const scores = [];
		let currentQuestionIndex = 0;
		
		function showAnswer() {
			const answer = this.nextElementSibling;
			const isCorrect = this.parentNode.getAttribute("data-correct") === "true";
			answer.style.display = "block";
			if (isCorrect) {
				answer.querySelector(".correct").style.display = "block";
				answer.querySelector(".incorrect").style.display = "none";
				scores.push(1);
			} else {
				answer.querySelector(".correct").style.display = "none";
				answer.querySelector(".incorrect").style.display = "block";
				scores.push(0);
			}
			this.style.display = "none";
			if (currentQuestionIndex === questions.length - 1) {
				showResult();
			} else {
				currentQuestionIndex++;
			}
		}
		
		function showResult() {
			const result = document.querySelector(".result");
			const score = document.querySelector("#score");
			const totalScore = scores.reduce((acc, value) => acc + value, 0);
			score.textContent = "あなたのスコアは " + totalScore + " / " + scores.length + "です！";
			result.style.display = "block";
		}
		
		function restart() {
			window.location.reload();
		}
		
		const checkAnswerButtons = document.querySelectorAll(".check-answer");
		checkAnswerButtons.forEach(button => {
			button.addEventListener("click", showAnswer);
			button.parentNode.setAttribute("data-correct", "false");
			if (button.parentNode.querySelector("p").textContent.indexOf("あり") !== -1) {
				button.parentNode.setAttribute("data-correct", "true");
			} else if (button.parentNode.querySelector("p").textContent.indexOf("なし") !== -1) {
				button.parentNode.setAttribute("data-correct", "false");
			} else {
				throw new Error("Invalid question!");
			}
		});
		
		const playAgainButton = document.querySelector(".play-again");
		playAgainButton.addEventListener("click", restart);
	</script>
</body>
</html>

このアプリはあるなしクイズです。3つの質問があり、それぞれ「スマートフォンは存在するか？」「月は四角い形をしているか？」「アップル社の創業者はスティーブ・ジョブズか？」という内容です。スマートフォンは存在するため「あり」、月は四角い形をしていないため「なし」、そしてアップル社の創業者はスティーブ・ジョブズであるため「あり」と答えることになります。答えを見るボタンをクリックすると、正解か不正解かが表示され、その後に次の質問に進みます。最後の質問を解いた後は、スコアが表示され、もう一度遊ぶことができます。絵文字は使用していませんが、スマホで操作することが前提になっているため、ボタンなどをタップすることで遊ぶことができます。