Multiplication Master
गुणा का खेल!
स्कोर: 0 / 10
? × ? =
बधाई हो! आपने 10 अंक प्राप्त किए! 🎉
body {
font-family: ‘Arial’, sans-serif;
background-color: #f0f2f5;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
margin: 0;
}
.game-container {
background: white;
padding: 30px;
border-radius: 15px;
box-shadow: 0 10px 25px rgba(0,0,0,0.1);
text-align: center;
width: 350px;
}
h1 { color: #333; }
#score-board {
font-size: 1.2rem;
margin-bottom: 20px;
color: #4CAF50;
font-weight: bold;
}
.question-box {
font-size: 2rem;
margin-bottom: 20px;
}
input {
width: 80px;
font-size: 1.5rem;
padding: 5px;
text-align: center;
border: 2px solid #ddd;
border-radius: 5px;
}
button {
background-color: #4CAF50;
color: white;
border: none;
padding: 10px 20px;
font-size: 1rem;
border-radius: 5px;
cursor: pointer;
transition: 0.3s;
}
button:hover { background-color: #45a049; }
#feedback {
margin-top: 15px;
font-weight: bold;
height: 20px;
}
.hidden { display: none; }
.correct { color: green; animation: bounce 0.5s; }
.wrong { color: red; }
@keyframes bounce {
0%, 100% { transform: translateY(0); }
50% { transform: translateY(-10px); }
}
let score = 0;
let correctAnswer = 0;
function generateQuestion() {
// 1 से 10 के बीच रैंडम नंबर
const n1 = Math.floor(Math.random() * 10) + 1;
const n2 = Math.floor(Math.random() * 10) + 1;
document.getElementById(‘num1’).innerText = n1;
document.getElementById(‘num2’).innerText = n2;
correctAnswer = n1 * n2;
document.getElementById(‘answer’).value = ”;
document.getElementById(‘answer’).focus();
}
function checkAnswer() {
const userAnswer = parseInt(document.getElementById(‘answer’).value);
const feedback = document.getElementById(‘feedback’);
if (userAnswer === correctAnswer) {
score++;
document.getElementById(‘score’).innerText = score;
feedback.innerText = “सही जवाब! 🌟”;
feedback.className = “correct”;
if (score >= 10) {
endGame();
} else {
setTimeout(generateQuestion, 1000); // 1 सेकंड बाद अगला सवाल
}
} else {
feedback.innerText = “गलत! फिर से कोशिश करें।”;
feedback.className = “wrong”;
}
}
function endGame() {
document.querySelector(‘.question-box’).classList.add(‘hidden’);
document.getElementById(‘submit-btn’).classList.add(‘hidden’);
document.getElementById(‘feedback’).classList.add(‘hidden’);
document.getElementById(‘final-screen’).classList.remove(‘hidden’);
}
function resetGame() {
score = 0;
document.getElementById(‘score’).innerText = score;
document.querySelector(‘.question-box’).classList.remove(‘hidden’);
document.getElementById(‘submit-btn’).classList.remove(‘hidden’);
document.getElementById(‘feedback’).classList.remove(‘hidden’);
document.getElementById(‘final-screen’).classList.add(‘hidden’);
generateQuestion();
}
// गेम शुरू करने के लिए पहला सवाल
generateQuestion();
// Enter key दबाने पर भी चेक हो जाए
document.getElementById(‘answer’).addEventListener(‘keypress’, function (e) {
if (e.key === ‘Enter’) {
checkAnswer();
}
});