विज्ञान MCQ क्विज़ | Science Bilingual Quiz with Explanations * { margin: 0; padding: 0; box-sizing: border-box; -webkit-tap-highlight-color: transparent; } body { background: linear-gradient(145deg, #eef2f7 0%, #d9e2ec 100%); padding: 0; min-height: 100vh; font-family: 'Segoe UI', Roboto, -apple-system, BlinkMacSystemFont, 'Noto Sans', system-ui, sans-serif; } .container { max-width: 100%; margin: 0 auto; padding: 0; } /* Simple header without timer */ .quiz-header { background: linear-gradient(135deg, #0b2b5c, #102b47); color: white; padding: 16px 20px; border-radius: 0 0 28px 28px; text-align: center; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); margin-bottom: 12px; } .quiz-header h1 { font-size: 1.5rem; font-weight: 700; letter-spacing: -0.3px; background: linear-gradient(120deg, #ffffff, #e0f2fe); background-clip: text; -webkit-background-clip: text; color: transparent; } .quiz-header p { font-size: 0.8rem; opacity: 0.85; margin-top: 5px; } .quiz-content { padding: 8px 8px 12px 8px; } /* Quiz card */ .quiz-card { background: rgba(255, 255, 255, 0.98); border-radius: 24px; padding: 18px 16px; margin-bottom: 16px; box-shadow: 0 6px 16px -8px rgba(0, 0, 0, 0.15); transition: all 0.2s ease; border: 1px solid #ffffff80; width: 100%; } .question { font-size: 1rem; font-weight: 700; line-height: 1.45; margin-bottom: 18px; color: #0f2b3d; border-left: 5px solid #2c7da0; padding-left: 14px; background: #f9fafc; border-radius: 16px; word-break: break-word; } /* option label styling */ .option-label { display: flex; align-items: flex-start; gap: 12px; background: #f1f5f9; margin-bottom: 12px; padding: 14px 16px; border-radius: 60px; cursor: pointer; transition: all 0.2s; border: 1.5px solid transparent; font-weight: 500; touch-action: manipulation; width: 100%; } .option-label:active { background: #e2eafc; transform: scale(0.98); } input[type="radio"] { width: 22px; height: 22px; min-width: 22px; accent-color: #1e4a76; cursor: pointer; margin-top: 2px; } .option-text { font-size: 0.9rem; line-height: 1.4; flex: 1; word-break: break-word; } /* Explanation section */ .explanation-box { margin-top: 16px; padding: 14px 16px; background: #fef3c7; border-left: 5px solid #f59e0b; border-radius: 16px; display: none; font-size: 0.85rem; line-height: 1.5; color: #78350f; } .explanation-box.show { display: block; animation: fadeIn 0.3s ease; } .explanation-title { font-weight: 700; margin-bottom: 6px; display: flex; align-items: center; gap: 8px; } .explanation-title i { color: #f59e0b; } .explanation-text { font-size: 0.85rem; } @keyframes fadeIn { from { opacity: 0; transform: translateY(-5px); } to { opacity: 1; transform: translateY(0); } } /* submit button */ .submit-btn { background: linear-gradient(95deg, #1f6392, #0f3b60); border: none; color: white; font-size: 1.2rem; font-weight: bold; padding: 18px 20px; border-radius: 60px; cursor: pointer; width: 100%; transition: 0.2s; margin: 8px 0 20px; box-shadow: 0 6px 14px rgba(0, 0, 0, 0.2); letter-spacing: 0.5px; touch-action: manipulation; } .submit-btn:active { transform: scale(0.97); background: linear-gradient(95deg, #0e4b72, #0a2e48); } .result { background: #dcfce8; border-left: 10px solid #15803d; padding: 18px 16px; border-radius: 28px; font-size: 1.15rem; font-weight: bold; text-align: center; margin: 12px 0 20px; display: none; box-shadow: 0 6px 14px rgba(0,0,0,0.1); word-break: break-word; line-height: 1.5; } /* highlight styles */ .correct-highlight { background: #bbf7d0 !important; border-color: #15803d !important; } .wrong-highlight { background: #ffe4e2 !important; border-color: #dc2626 !important; } ::-webkit-scrollbar { width: 3px; } button, .option-label { -webkit-tap-highlight-color: rgba(59,130,246,0.2); } @media (max-width: 600px) { .quiz-content { padding: 6px 6px 10px 6px; } .quiz-header { padding: 14px 16px; } .quiz-header h1 { font-size: 1.3rem; } .quiz-card { padding: 16px 14px; margin-bottom: 14px; } .question { font-size: 0.95rem; padding-left: 12px; } .option-label { padding: 12px 14px; gap: 10px; } .option-text { font-size: 0.87rem; } .explanation-box { padding: 12px 14px; font-size: 0.8rem; } .submit-btn { font-size: 1.1rem; padding: 16px; } } @media (max-width: 380px) { .option-text { font-size: 0.82rem; } .question { font-size: 0.9rem; } } 🔬 विज्ञान MCQ क्विज़ | Science Bilingual Quiz 24 प्रश्न | प्रत्येक प्रश्न के बाद व्याख्या | 24 Questions with Explanations ✅ Submit Quiz / जमा करें // -------------------------------------------------------------- // BILINGUAL QUESTIONS WITH EXPLANATIONS (English + Hindi) // 24 MCQs - Each has question, options, answer, and explanation // -------------------------------------------------------------- const questionsData = [ { qText: "What is the SI unit of pressure? / दाब की SI इकाई क्या है?", opts: [ "Newton per square centimetre / न्यूटन प्रति वर्ग सेंटीमीटर", "Newton square metre / न्यूटन-वर्ग मीटर", "Newton per square metre / न्यूटन प्रति वर्ग मीटर", "Newton square centimetre / न्यूटन-वर्ग सेंटीमीटर" ], ans: "C", explanation: "The SI unit of pressure is Pascal (Pa), which is equal to Newton per square metre (N/m²). / दाब की SI इकाई पास्कल (Pa) है, जो न्यूटन प्रति वर्ग मीटर (N/m²) के बराबर होती है।" }, { qText: "The working system of old pendulum clocks was completely? / पुरानी पेंडुलम घड़ी की कार्य प्रणाली पूरी तरह कैसी थी?", opts: [ "Mechanical / यांत्रिक", "Mechanical and electrical / यांत्रिक एवं विद्युत", "Electrical / विद्युत", "Battery operated / बैटरी संचालित" ], ans: "A", explanation: "Old pendulum clocks were completely mechanical, using gears and a swinging pendulum to measure time. / पुरानी पेंडुलम घड़ियाँ पूरी तरह से यांत्रिक होती थीं, जो समय मापने के लिए गियर और झूलते पेंडुलम का उपयोग करती थीं।" }, { qText: "What are the characteristics of image formed by a plane mirror? / समतल दर्पण द्वारा बनी छवि की विशेषताएँ क्या हैं?", opts: [ "Same size, erect, laterally inverted, virtual / समान आकार, सीधी, पार्श्व उलटी, आभासी", "Same size, erect, inverted, real / समान आकार, सीधी, उलटी, वास्तविक", "Different size, erect, inverted, virtual / अलग आकार, सीधी, उलटी, आभासी", "Different size, magnified, inverted, virtual / अलग आकार, आवर्धित, उलटी, आभासी" ], ans: "A", explanation: "Plane mirror forms an image that is same size, erect (upright), laterally inverted (left-right swapped), and virtual (cannot be captured on screen). / समतल दर्पण समान आकार, सीधी, पार्श्व उलटी और आभासी छवि बनाता है।" }, { qText: "Why do stars twinkle at night? / तारे रात में क्यों टिमटिमाते हैं?", opts: [ "Due to advanced light / उन्नत प्रकाश", "Due to atmospheric refraction / वायुमंडलीय अपवर्तन", "Due to propagation of light / प्रकाश का प्रसारण", "Due to hot air / गर्म हवा" ], ans: "B", explanation: "Stars twinkle due to atmospheric refraction of starlight as it passes through Earth's varying atmospheric layers. / तारे पृथ्वी के वायुमंडल की विभिन्न परतों से गुजरते समय प्रकाश के अपवर्तन के कारण टिमटिमाते हैं।" }, { qText: "How much work is done in moving 4 C charge through 10 V potential difference? / 10 वोल्ट विभवांतर में 4 कुलाम आवेश को ले जाने में कितना कार्य होगा?", opts: [ "10 J / 10 जूल", "48 J / 48 जूल", "40 J / 40 जूल", "44 J / 44 जूल" ], ans: "C", explanation: "Work = Charge × Potential difference = 4 C × 10 V = 40 Joules. / कार्य = आवेश × विभवांतर = 4 कुलाम × 10 वोल्ट = 40 जूल।" }, { qText: "A conductor having very high resistance is called? / अत्यधिक प्रतिरोध वाले पदार्थ को क्या कहते हैं?", opts: [ "Conductor / चालक", "Insulator / विद्युतरोधी", "Resistor / प्रतिरोधक", "Semiconductor / अर्धचालक" ], ans: "B", explanation: "Materials with very high resistance are called insulators, as they do not allow electric current to flow easily. / अत्यधिक प्रतिरोध वाले पदार्थ विद्युतरोधी कहलाते हैं, क्योंकि वे विद्युत धारा को आसानी से प्रवाहित नहीं होने देते।" }, { qText: "The thin wire in electric bulb is called? / विद्युत बल्ब में पतले तार को क्या कहते हैं?", opts: [ "Resistance / प्रतिरोध", "Fuse / फ्यूज", "Relay / रिले", "Filament / फिलामेंट" ], ans: "D", explanation: "The thin wire that glows in an electric bulb is called the filament, usually made of tungsten. / विद्युत बल्ब में चमकने वाले पतले तार को फिलामेंट कहते हैं, जो आमतौर पर टंगस्टन का बना होता है।" }, { qText: "Who received the first American patent for sewing machine invention? / सिलाई मशीन का पहला अमेरिकी पेटेंट किसे मिला?", opts: [ "Elias Howe / एलियास होवे", "Alessandro Volta / एलेसेंड्रो वोल्टा", "Ernest Rutherford / अर्नेस्ट रदरफोर्ड", "John Napier / जॉन नेपियर" ], ans: "A", explanation: "Elias Howe received the first US patent for the sewing machine in 1846. / एलियास होवे को 1846 में सिलाई मशीन का पहला अमेरिकी पेटेंट मिला था।" }, { qText: "Which tissue contains flat cells? / किस ऊतक में चपटी कोशिकाएँ होती हैं?", opts: [ "Plasma cells / प्लाज्मा कोशिकाएँ", "Cuboidal epithelium / घनाभाकार उपकला", "Squamous epithelium / शल्कीय उपकला", "Mast cells / मास्ट कोशिकाएँ" ], ans: "C", explanation: "Squamous epithelium consists of flat, scale-like cells that line surfaces like blood vessels and lungs. / शल्कीय उपकला में चपटी, शल्क जैसी कोशिकाएँ होती हैं जो रक्त वाहिकाओं और फेफड़ों जैसी सतहों को अस्तर करती हैं।" }, { qText: "Who is related to theory of evolution? / विकासवाद के सिद्धांत से कौन संबंधित है?", opts: [ "Miller / मिलर", "Charles Darwin / चार्ल्स डार्विन", "Lamarck / लैमार्क", "Gregor Mendel / ग्रेगर मेंडल" ], ans: "B", explanation: "Charles Darwin proposed the theory of evolution by natural selection in his book 'On the Origin of Species'. / चार्ल्स डार्विन ने अपनी पुस्तक 'ऑन द ओरिजिन ऑफ स्पीशीज़' में प्राकृतिक चयन द्वारा विकासवाद का सिद्धांत प्रस्तावित किया।" }, { qText: "Pulmonary vein is connected to which chamber of heart? / फुफ्फुसीय शिरा हृदय के किस भाग से जुड़ी होती है?", opts: [ "Left atrium / बायाँ आलिंद", "Right atrium / दायाँ आलिंद", "Left ventricle / बायाँ निलय", "Right ventricle / दायाँ निलय" ], ans: "A", explanation: "The pulmonary vein carries oxygenated blood from the lungs to the left atrium of the heart. / फुफ्फुसीय शिरा फेफड़ों से ऑक्सीजन युक्त रक्त को हृदय के बाएं आलिंद तक ले जाती है।" }, { qText: "Which part of brain controls breathing? / मस्तिष्क का कौन-सा भाग श्वसन नियंत्रित करता है?", opts: [ "Mid brain / मध्य मस्तिष्क", "Fore brain / अग्र मस्तिष्क", "Medulla / मेडुला", "Cerebellum / अनुमस्तिष्क" ], ans: "C", explanation: "The medulla oblongata in the brainstem controls automatic functions like breathing and heart rate. / मेडुला ऑब्लांगेटा श्वसन और हृदय गति जैसे स्वचालित कार्यों को नियंत्रित करता है।" }, { qText: "Fertilized egg gets embedded in which layer? / निषेचित अंडा कहाँ स्थापित होता है?", opts: [ "Oviduct / अंडवाहिनी", "Vagina / योनि", "Cervix / गर्भाशय ग्रीवा", "Uterus / गर्भाशय" ], ans: "D", explanation: "The fertilized egg (zygote) implants itself in the lining of the uterus (endometrium). / निषेचित अंडा (युग्मनज) गर्भाशय की परत (एंडोमेट्रियम) में प्रत्यारोपित होता है।" }, { qText: "Which option is not correctly matched? / कौन-सा विकल्प सही सुमेलित नहीं है?", opts: [ "Malaria : Protozoa / मलेरिया : प्रोटोजोआ", "Measles : Bacteria / खसरा : जीवाणु", "Tetanus : Bacteria / टिटनेस : जीवाणु", "Typhoid : Bacteria / टाइफॉयड : जीवाणु" ], ans: "B", explanation: "Measles is caused by a virus, not bacteria. All other options are correctly matched. / खसरा वायरस के कारण होता है, जीवाणु से नहीं। अन्य सभी विकल्प सही सुमेलित हैं।" }, { qText: "Which plant belongs to Bryophyta? / कौन-सा पौधा ब्रायोफाइटा वर्ग में आता है?", opts: [ "Ulothrix / यूलोथ्रिक्स", "Cladophora / क्लैडोफोरा", "Riccia / रिक्सिया", "Marsilea / मार्सिलिया" ], ans: "C", explanation: "Riccia is a genus of liverworts belonging to Bryophyta (non-vascular plants). / रिक्सिया लिवरवॉर्ट्स की एक प्रजाति है जो ब्रायोफाइटा (गैर-संवहनी पौधे) से संबंधित है।" }, { qText: "Guard cells are involved in which process? / रक्षक कोशिकाएँ किस प्रक्रिया में भाग लेती हैं?", opts: [ "Transpiration / वाष्पोत्सर्जन", "Circulation / परिसंचरण", "Transport of food / भोजन परिवहन", "Tropic movement / अनुक्रियात्मक गति" ], ans: "A", explanation: "Guard cells control the opening and closing of stomata, regulating transpiration and gas exchange. / रक्षक कोशिकाएँ रंध्रों के खुलने और बंद होने को नियंत्रित करती हैं, जिससे वाष्पोत्सर्जन और गैस विनिमय नियंत्रित होता है।" }, { qText: "Which part changes into seed in a plant? / पौधे में कौन-सा भाग बीज में बदलता है?", opts: [ "Stigma / वर्तिकाग्र", "Ovary / अंडाशय", "Style / वर्तिका", "Ovule / बीजांड" ], ans: "D", explanation: "After fertilization, the ovule develops into the seed, while the ovary becomes the fruit. / निषेचन के बाद, बीजांड बीज में विकसित होता है, जबकि अंडाशय फल बन जाता है।" }, { qText: "A heterogeneous mixture with suspended particles is called? / वह विषम मिश्रण जिसमें कण निलंबित रहते हैं क्या कहलाता है?", opts: [ "Unsaturated solution / असंतृप्त विलयन", "Suspension / निलंबन", "Colloid / कोलॉइड", "Saturated solution / संतृप्त विलयन" ], ans: "B", explanation: "A suspension is a heterogeneous mixture where particles settle over time and can be seen with the naked eye. / निलंबन एक विषम मिश्रण है जिसमें कण समय के साथ बैठ जाते हैं और नग्न आंखों से देखे जा सकते हैं।" }, { qText: "How many molecules are present in one gram hydrogen? / एक ग्राम हाइड्रोजन में कितने अणु होते हैं?", opts: [ "1.5×10^23 / 1.5×10^23", "6.02×10^23 / 6.02×10^23", "2.5×10^23 / 2.5×10^23", "3.01×10^23 / 3.01×10^23" ], ans: "D", explanation: "1 gram of H₂ contains 3.01 × 10²³ molecules (half of Avogadro's number since molar mass of H₂ is 2g/mol). / 1 ग्राम H₂ में 3.01 × 10²³ अणु होते हैं (क्योंकि H₂ का मोलर द्रव्यमान 2g/mol है, जो एवोगैड्रो संख्या का आधा है)।" }, { qText: "Calculate molecular mass of water H₂O. / जल H₂O का आणविक द्रव्यमान ज्ञात करें।", opts: [ "20 u / 20 u", "18 u / 18 u", "2 u / 2 u", "1.8 u / 1.8 u" ], ans: "B", explanation: "Molecular mass of H₂O = (2×1) + 16 = 18 u. / H₂O का आणविक द्रव्यमान = (2×1) + 16 = 18 u." }, { qText: "Which element has electronic configuration 2,8,3? / 2,8,3 इलेक्ट्रॉनिक विन्यास किस तत्व का है?", opts: [ "Magnesium / मैग्नीशियम", "Aluminium / एल्युमिनियम", "Argon / आर्गन", "Sodium / सोडियम" ], ans: "B", explanation: "Aluminium (Atomic number 13) has electronic configuration 2,8,3. / एल्युमिनियम (परमाणु संख्या 13) का इलेक्ट्रॉनिक विन्यास 2,8,3 है।" }, { qText: "Which two elements have same number of valence electrons? / किन दो तत्वों में संयोजक इलेक्ट्रॉन समान होते हैं?", opts: [ "F and Cl / F और Cl", "N and C / N और C", "H and He / H और He", "B and Br / B और Br" ], ans: "A", explanation: "Fluorine (F) and Chlorine (Cl) both have 7 valence electrons as they belong to the same group (Halogens). / फ्लोरीन (F) और क्लोरीन (Cl) दोनों में 7 संयोजक इलेक्ट्रॉन होते हैं क्योंकि वे एक ही समूह (हैलोजन) से संबंधित हैं।" }, { qText: "Common salt NaCl is formed from? / खाने का नमक NaCl किससे बनता है?", opts: [ "Strong acid and strong base / प्रबल अम्ल और प्रबल क्षार", "Weak acid and weak base / दुर्बल अम्ल और दुर्बल क्षार", "Weak acid and strong base / दुर्बल अम्ल और प्रबल क्षार", "Strong acid and weak base / प्रबल अम्ल और दुर्बल क्षार" ], ans: "A", explanation: "NaCl is formed from strong acid (HCl) and strong base (NaOH), resulting in a neutral salt. / NaCl प्रबल अम्ल (HCl) और प्रबल क्षार (NaOH) से बनता है, जिससे उदासीन लवण बनता है।" }, { qText: "What is the correct formula of washing soda? / धावन सोडा का सही सूत्र क्या है?", opts: [ "Na₂CO₃·10H₂O / Na₂CO₃·10H₂O", "Na₂CO₃·H₂O / Na₂CO₃·H₂O", "Na₂CO₃·6H₂O / Na₂CO₃·6H₂O", "Na₂CO₃ / Na₂CO₃" ], ans: "A", explanation: "Washing soda is sodium carbonate decahydrate with formula Na₂CO₃·10H₂O. / धावन सोडा सोडियम कार्बोनेट डेकाहाइड्रेट है जिसका सूत्र Na₂CO₃·10H₂O है।" } ]; // ---------- DOM elements ---------- const questionsPanel = document.getElementById("questionsPanel"); // Build quiz (single numbering - no duplicate numbers) function buildQuiz() { questionsPanel.innerHTML = ""; questionsData.forEach((q, idx) => { const qNumber = idx + 1; const card = document.createElement("div"); card.className = "quiz-card"; card.setAttribute("data-qidx", idx); const questionDiv = document.createElement("div"); questionDiv.className = "question"; questionDiv.innerText = `${qNumber}. ${q.qText}`; card.appendChild(questionDiv); const optionsDiv = document.createElement("div"); optionsDiv.className = "options-wrapper"; const letters = ["A", "B", "C", "D"]; q.opts.forEach((optText, optIdx) => { const letterVal = letters[optIdx]; const label = document.createElement("label"); label.className = "option-label"; const radio = document.createElement("input"); radio.type = "radio"; radio.name = `q_${idx}`; radio.value = letterVal; radio.setAttribute("data-qidx", idx); const span = document.createElement("span"); span.className = "option-text"; span.innerText = `${letterVal}) ${optText}`; label.appendChild(radio); label.appendChild(span); optionsDiv.appendChild(label); }); card.appendChild(optionsDiv); // Explanation box const explanationBox = document.createElement("div"); explanationBox.className = "explanation-box"; explanationBox.id = `explanation_${idx}`; explanationBox.innerHTML = ` Explanation / व्याख्या: ${q.explanation} `; card.appendChild(explanationBox); questionsPanel.appendChild(card); }); } function submitQuizEvaluation() { let score = 0; const totalQ = questionsData.length; // reset highlights and hide explanations const allLabels = document.querySelectorAll(".option-label"); allLabels.forEach(label => { label.classList.remove("correct-highlight", "wrong-highlight"); }); // hide all explanation boxes initially for (let i = 0; i < totalQ; i++) { const expBox = document.getElementById(`explanation_${i}`); if (expBox) expBox.classList.remove("show"); } // iterate each question for (let i = 0; i < totalQ; i++) { const correctLetter = questionsData[i].ans; const selectedRadio = document.querySelector(`input[name="q_${i}"]:checked`); const allRadios = document.querySelectorAll(`input[name="q_${i}"]`); // highlight correct answers in green, show explanation for every question allRadios.forEach(radio => { const parentLabel = radio.parentElement; if (radio.value === correctLetter) { parentLabel.classList.add("correct-highlight"); } if (selectedRadio && radio.checked && radio.value !== correctLetter) { parentLabel.classList.add("wrong-highlight"); } }); // Show explanation for this question after submission const expBox = document.getElementById(`explanation_${i}`); if (expBox) expBox.classList.add("show"); if (selectedRadio && selectedRadio.value === correctLetter) { score++; } } const resultDiv = document.getElementById("resultBox"); resultDiv.style.display = "block"; const percentage = Math.round((score / totalQ) * 100); let feedbackMsg = ""; if (percentage >= 80) feedbackMsg = "🏆 उत्कृष्ट! Excellent!"; else if (percentage >= 60) feedbackMsg = "👍 अच्छा प्रयास! Good effort!"; else feedbackMsg = "📚 और अभ्यास करें। Keep practicing!"; resultDiv.innerHTML = `📊 Your Score: ${score} / ${totalQ} (${percentage}%) ${feedbackMsg}✨ सही उत्तर हरे में, गलत लाल में ✨⭐ सभी प्रश्नों की व्याख्या नीचे दी गई है | Explanations shown below each question.`; setTimeout(() => { resultDiv.scrollIntoView({ behavior: "smooth", block: "nearest" }); }, 80); } function handleSubmit() { submitQuizEvaluation(); } function init() { buildQuiz(); const submitBtn = document.getElementById("submitQuizBtn"); if (submitBtn) submitBtn.addEventListener("click", handleSubmit); } document.addEventListener("DOMContentLoaded", init);