महिषासुर जन्म एवं उसका वध

महिषासुर प्रश्नोत्तरी body { font-family: 'Tiro Devanagari Hindi', serif; background: #F7F5F2; /* A slightly warm off-white background */ } .quiz-container { background-color: #FFFFFF; box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1); border-radius: 1.5rem; border: 1px solid #E5E7EB; } .option-btn { transition: all 0.3s ease; border-width: 2px; } .option-btn:hover { transform: translateY(-3px); box-shadow: 0 4px 15px rgba(0,0,0,0.08); } .option-btn.correct { background-color: #D1FAE5 !important; border-color: #10B981 !important; color: #065F46; } .option-btn.incorrect { background-color: #FEE2E2 !important; border-color: #EF4444 !important; color: #991B1B; } .progress-bar-inner { transition: width 0.4s ease-in-out; } .hint-box { background-color: #FEF3C7; /* Light yellow for hints */ border-left: 4px solid #FBBF24; /* Amber border */ } .rationale { font-style: italic; color: #4B5563; /* Gray-600 for rationale text */ } const quizData = [ { "question": "रम्भकल्प की कथा के अनुसार, महिषासुर का जन्म किससे हुआ था?", "answerOptions": [ { "text": "एक अप्सरा से", "rationale": "यद्यपि पौराणिक कथाओं में अप्सराओं का उल्लेख है, पर महिषासुर के जन्म का संबंध उनसे नहीं है।", "isCorrect": false }, { "text": "एक महिषी (जल-भैंस) से", "rationale": "रम्भ के तपोबल के फलस्वरूप उसका विवाह एक महिषी से हुआ, जिससे महिषासुर का जन्म हुआ।", "isCorrect": true }, { "text": "एक दानवी से", "rationale": "हालांकि महिषासुर स्वयं एक दानव (असुर) था, पर रम्भकल्प में उसकी माता एक महिषी थी।", "isCorrect": false }, { "text": "अग्नि कुंड से", "rationale": "अग्निदेव ने रम्भ को पुत्र का वरदान दिया था, परन्तु महिषासुर का जन्म सीधे अग्नि से नहीं हुआ।", "isCorrect": false } ], "hint": "महिषासुर के नाम में ही उसकी माता का संकेत छिपा है।" }, { "question": "नीललोहित कल्प में महिषासुर का जन्म किस असाधारण घटना का परिणाम था?", "answerOptions": [ { "text": "एक महायज्ञ का", "rationale": "यज्ञों से देवताओं को शक्ति मिलती थी, पर इस कल्प में महिषासुर के जन्म का कारण यह नहीं था।", "isCorrect": false }, { "text": "देवताओं के वरदान का", "rationale": "इस कथा में वरदान नहीं, बल्कि एक विपरीत घटना जन्म का कारण बनी।", "isCorrect": false }, { "text": "एक ऋषि के श्राप का", "rationale": "एक असुर कन्या को दिए गए श्राप और उससे मुक्ति की शर्त के रूप में महिषासुर का जन्म हुआ।", "isCorrect": true }, { "text": "एक दिव्य संयोग का", "rationale": "यह कोई आकस्मिक संयोग नहीं था, बल्कि एक श्राप का सीधा परिणाम था।", "isCorrect": false } ], "hint": "इस कथा में जन्म का संबंध किसी की मुक्ति से था।" }, { "question": "महिषासुर की कौन से कल्प की कथा सीधे तौर पर दुर्गा पूजा और नवरात्रि के त्यौहार से जुड़ी है?", "answerOptions": [ { "text": "रम्भकल्प", "rationale": "रम्भकल्प की कथा सर्वाधिक प्रचलित है, लेकिन इसका सीधा संबंध नवरात्रि उत्सव से नहीं है।", "isCorrect": false }, { "text": "नीललोहित कल्प", "rationale": "यह कथा एक अलग ब्रह्मांडीय चक्र का वर्णन करती है और दुर्गा पूजा से नहीं जुड़ी है।", "isCorrect": false }, { "text": "श्वेतवाराह कल्प", "rationale": "इसी कल्प की कथा में नौ दिनों तक चले युद्ध का वर्णन है, जो नवरात्रि के रूप में मनाया जाता है।", "isCorrect": true }, { "text": "उपरोक्त में से कोई नहीं", "rationale": "विकल्पों में से एक सही उत्तर है जो एक प्रमुख हिंदू त्योहार की नींव रखता है।", "isCorrect": false } ], "hint": "इस कथा में नौ दिनों तक चले एक भयंकर युद्ध का वर्णन मिलता है।" }, { "question": "रम्भकल्प में महिषासुर को ब्रह्मा जी से क्या विशिष्ट वरदान प्राप्त हुआ था?", "answerOptions": [ { "text": "अमरता का वरदान", "rationale": "पौराणिक कथाओं में पूर्ण अमरता का वरदान लगभग असंभव है।", "isCorrect": false }, { "text": "उसे कोई भी देवता या दानव नहीं मार सकेगा", "rationale": "यह वरदान का एक हिस्सा था, लेकिन इसमें एक महत्वपूर्ण शर्त शामिल थी।", "isCorrect": false }, { "text": "उसका वध केवल एक स्त्री ही कर सकेगी", "rationale": "महिषासुर ने अहंकारवश यह वरदान माँगा था, क्योंकि वह एक स्त्री को कमजोर समझता था।", "isCorrect": true }, { "text": "त्रिलोक का स्वामी बनने का वरदान", "rationale": "उसने त्रिलोक पर अधिकार तो कर लिया था, परन्तु यह उसके वरदान का हिस्सा नहीं, बल्कि उसकी शक्ति का परिणाम था।", "isCorrect": false } ], "hint": "यही वरदान अंत में उसके विनाश का कारण बना।" }, { "question": "तीनों कल्पों में वर्णित महिषासुर की कथाओं का सार्वभौमिक संदेश क्या है?", "answerOptions": [ { "text": "वरदानों का दुरुपयोग विनाशकारी होता है।", "rationale": "यह एक महत्वपूर्ण संदेश है, लेकिन यह कथा के केंद्रीय और सबसे बड़े संदेश को पूरी तरह से नहीं दर्शाता है।", "isCorrect": false }, { "text": "अधर्म पर धर्म की सदैव विजय होती है।", "rationale": "प्रत्येक कथा का अंत इसी शाश्वत सत्य को स्थापित करता है कि बुरी शक्तियाँ चाहे कितनी भी प्रबल हों, अंत में अच्छाई ही जीतती है।", "isCorrect": true }, { "text": "नारी शक्ति सर्वोपरि है।", "rationale": "यह कथा नारी शक्ति को महिमामंडित करती है, जो कि व्यापक संदेश का एक महत्वपूर्ण पहलू है।", "isCorrect": false }, { "text": "तपस्या से असीम शक्ति प्राप्त की जा सकती है।", "rationale": "यह सच है कि पात्रों ने तपस्या से शक्ति प्राप्त की, लेकिन यह कथा का अंतिम निष्कर्ष नहीं है।", "isCorrect": false } ], "hint": "यह एक शाश्वत सत्य है जो लगभग सभी पौराणिक कथाओं का आधार है।" } ]; const questionTextEl = document.getElementById('question-text'); const optionsContainerEl = document.getElementById('options-container'); const nextBtn = document.getElementById('next-btn'); const quizContainer = document.getElementById('quiz-container'); const resultsContainer = document.getElementById('results-container'); const scoreTextEl = document.getElementById('score-text'); const restartBtn = document.getElementById('restart-btn'); const progressBar = document.getElementById('progress-bar'); const progressText = document.getElementById('progress-text'); const hintBox = document.getElementById('hint-box'); const hintText = document.getElementById('hint-text'); const rationaleContainer = document.getElementById('rationale-container'); let currentQuestionIndex = 0; let score = 0; function startQuiz() { currentQuestionIndex = 0; score = 0; quizContainer.classList.remove('hidden'); resultsContainer.classList.add('hidden'); nextBtn.classList.add('hidden'); showQuestion(); } function updateProgress() { const progressPercentage = ((currentQuestionIndex) / quizData.length) * 100; progressBar.style.width = `${progressPercentage}%`; progressText.textContent = `प्रश्न ${currentQuestionIndex} / ${quizData.length}`; } function showQuestion() { resetState(); updateProgress(); const currentQuestion = quizData[currentQuestionIndex]; questionTextEl.textContent = currentQuestion.question; hintText.textContent = currentQuestion.hint; currentQuestion.answerOptions.forEach(option => { const button = document.createElement('button'); button.innerHTML = option.text; button.classList.add('option-btn', 'w-full', 'p-4', 'text-left', 'bg-white', 'border-gray-300', 'rounded-xl', 'font-medium'); button.dataset.correct = option.isCorrect; button.addEventListener('click', selectAnswer); optionsContainerEl.appendChild(button); }); progressText.textContent = `प्रश्न ${currentQuestionIndex + 1} / ${quizData.length}`; } function resetState() { nextBtn.classList.add('hidden'); hintBox.classList.add('hidden'); rationaleContainer.innerHTML = ''; while (optionsContainerEl.firstChild) { optionsContainerEl.removeChild(optionsContainerEl.firstChild); } } function selectAnswer(e) { const selectedBtn = e.target; const isCorrect = selectedBtn.dataset.correct === 'true'; if (isCorrect) { score++; } else { hintBox.classList.remove('hidden'); } Array.from(optionsContainerEl.children).forEach(button => { setStatusClass(button, button.dataset.correct === 'true'); button.disabled = true; const optionText = button.innerHTML; const optionData = quizData[currentQuestionIndex].answerOptions.find(opt => opt.text === optionText); const rationaleDiv = document.createElement('div'); rationaleDiv.classList.add('rationale', 'p-2', 'rounded-md'); let icon = ''; if(button.dataset.correct === 'true') { icon = '✔️'; rationaleDiv.classList.add('bg-green-50'); } else { icon = '❌'; rationaleDiv.classList.add('bg-red-50'); } rationaleDiv.innerHTML = `${icon} ${optionText}: ${optionData.rationale}`; rationaleContainer.appendChild(rationaleDiv); }); if (quizData.length > currentQuestionIndex + 1) { nextBtn.classList.remove('hidden'); } else { setTimeout(showResults, 1500); // Wait a moment before showing results } const progressPercentage = ((currentQuestionIndex + 1) / quizData.length) * 100; progressBar.style.width = `${progressPercentage}%`; } function setStatusClass(element, correct) { if (correct) { element.classList.add('correct'); } else { element.classList.add('incorrect'); } } function showResults() { quizContainer.classList.add('hidden'); resultsContainer.classList.remove('hidden'); scoreTextEl.textContent = `${score} / ${quizData.length}`; } nextBtn.addEventListener('click', () => { currentQuestionIndex++; showQuestion(); }); restartBtn.addEventListener('click', startQuiz); startQuiz();