Don't wanna be here? Send us removal request.
Text
Quiz class wise
======================================================
Index.html
=====================================================
<!DOCTYPE html><html lang="en"> <head> <link rel="shortcut icon" href="logo.png" type="image/x-icon"> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>QUIZ</title> <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css"> <style> body { background-color: crimson; } .container { align-items: center; background-color: rgb(240, 254, 255); box-shadow: 5px 5px 5px rgb(63, 63, 63); margin: 30px; padding: 10px; border-radius: 20px; cursor: pointer; } .mini-container { align-items: center; background-color: rgb(240, 254, 255); box-shadow: 5px 5px 5px rgb(63, 63, 63); margin: 30px; margin-left: 250px; margin-right: 250px; padding: 15px; border-radius: 20px; cursor: pointer; } </style></head> <body> <center> <!-- never hide content --> <div class="home container" style="background-color: rgb(0, 26, 255);color: #fff;"> <h2>QUIZ</h2> </div> <!-- never hide content over --> <!-- instruction content --> <div class="start-quiz"> <div> <h3>INSTRUCTIONS</h3> <h5>TOTAL QUESTIONS = 5</h5> </div> <button class="w3-btn w3-light-green w3-hover-green w3-round-xxlarge w3-xlarge w3-padding w3-outline-none btn">PLAY</button><br> <a href="FeedbackPage.html"><button class="w3-margin w3-btn w3-purple w3-round w3-large">Feedback</button></a> </div> <!-- instruction content over --> <!-- choice of class or standard --> <div class="w3-hide" id="choice"> <div class="class container"> <h4>Choose Your Class</h4> </div> <div class="w3-content container c1"> <h4>1<sup>st</sup></h4> </div> <div id="c1"> <strong> <div class="mini-container" id="c1e">Easy</div> <div class="mini-container" id="c1h">Hard</div> </strong> </div> <div class="w3-content container c2"> <h4>2<sup>nd</sup></h4> </div> <div id="c2"> <strong> <div class="mini-container" id="c2e">Easy</div> <div class="mini-container" id="c2h">Hard</div> </strong> </div> <div class="w3-content container c3"> <h4>3<sup>rd</sup></h4> </div> <div id="c3"> <strong> <div class="mini-container" id="c3e">Easy</div> <div class="mini-container" id="c3h">Hard</div> </strong> </div> <div class="w3-content container c4"> <h4>4<sup>th</sup></h4> </div> <div id="c4"> <strong> <div class="mini-container" id="c4e">Easy</div> <div class="mini-container" id="c4h">Hard</div> </strong> </div> <div class="w3-content container c5"> <h4>5<sup>th</sup></h4> </div> <div id="c5"> <strong> <div class="mini-container" id="c5e">Easy</div> <div class="mini-container" id="c5h">Hard</div> </strong> </div> <div class="w3-content container c6"> <h4>6<sup>th</sup></h4> </div> <div id="c6"> <strong> <div class="mini-container" id="c6e">Easy</div> <div class="mini-container" id="c6h">Hard</div> </strong> </div> <div class="w3-content container c7"> <h4>7<sup>th</sup></h4> </div> <div id="c7"> <strong> <div class="mini-container" id="c7e">Easy</div> <div class="mini-container" id="c7h">Hard</div> </strong> </div> <div class="w3-content container c8"> <h4>8<sup>th</sup></h4> </div> <div id="c8"> <strong> <div class="mini-container" id="c8e">Easy</div> <div class="mini-container" id="c8h">Hard</div> </strong> </div> <div class="w3-content container c9"> <h4>9<sup>th</sup></h4> </div> <div id="c9"> <strong> <div class="mini-container" id="c9e">Easy</div> <div class="mini-container" id="c9h">Hard</div> </strong> </div> <div class="w3-content container c10"> <h4>10<sup>th</sup></h4> </div> <div id="c10"> <strong> <div class="mini-container" id="c10e">Easy</div> <div class="mini-container" id="c10h">Hard</div> </strong> </div> </div> </center></body><script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script><script> $('.home').click(function(e) { e.preventDefault(); var name = prompt('Your name', ''); if ((name = 'null') || (name = '')) { alert('We welcome you') } else { alert('Hello ' + name + ', We welcome you') } }); $('.class').click(function(e) { e.preventDefault(); alert('choose your standard') }); $('.btn').click(function(e) { e.preventDefault(); $('#c1').hide(); $('#c2').hide(); $('#c3').hide(); $('#c4').hide(); $('#c5').hide(); $('#c6').hide(); $('#c7').hide(); $('#c10').hide(); $('#c8').hide(); $('#c9').hide(); $('.start-quiz').hide(); $('#choice').removeClass('w3-hide'); }); $('.c1').click(function(e) { e.preventDefault(); $('#c1').toggle(); }); $('.c2').click(function(e) { e.preventDefault(); $('#c2').toggle(); }); $('.c3').click(function(e) { e.preventDefault(); $('#c3').toggle(); }); $('.c4').click(function(e) { e.preventDefault(); $('#c4').toggle(); }); $('.c5').click(function(e) { e.preventDefault(); $('#c5').toggle(); }); $('.c7').click(function(e) { e.preventDefault(); $('#c7').toggle(); }); $('.c6').click(function(e) { e.preventDefault(); $('#c6').toggle(); }); $('.c8').click(function(e) { e.preventDefault(); $('#c8').toggle(); }); $('.c9').click(function(e) { e.preventDefault(); $('#c9').toggle(); }); $('.c10').click(function(e) { e.preventDefault(); $('#c10').toggle(); }); //================================== // button click effect // ================================= $('#c1e').click(function (e) { e.preventDefault(); window.location.assign('1 class easy.html') }); $('#c1h').click(function (e) { e.preventDefault(); window.location.assign('1 class hard.html') }); $('#c2e').click(function (e) { e.preventDefault(); window.location.assign('2 class easy.html') }); $('#c2h').click(function (e) { e.preventDefault(); window.location.assign('2 class hard.html') }); $('#c3e').click(function (e) { e.preventDefault(); window.location.assign('3 class easy.html') }); $('#c3h').click(function (e) { e.preventDefault(); window.location.assign('3 class hard.html') }); $('#c4e').click(function (e) { e.preventDefault(); window.location.assign('4 class easy.html') }); $('#c4h').click(function (e) { e.preventDefault(); window.location.assign('4 class hard.html') }); $('#c5e').click(function (e) { e.preventDefault(); window.location.assign('5 class easy.html') }); $('#c5h').click(function (e) { e.preventDefault(); window.location.assign('5 class hard.html') }); $('#c6e').click(function (e) { e.preventDefault(); window.location.assign('6 class easy.html') }); $('#c6h').click(function (e) { e.preventDefault(); window.location.assign('6 class hard.html') }); $('#c7e').click(function (e) { e.preventDefault(); window.location.assign('7 class easy.html') }); $('#c7h').click(function (e) { e.preventDefault(); window.location.assign('7 class hard.html') }); $('#c8e').click(function (e) { e.preventDefault(); window.location.assign('8 class easy.html') }); $('#c8h').click(function (e) { e.preventDefault(); window.location.assign('8 class hard.html') }); $('#c9e').click(function (e) { e.preventDefault(); window.location.assign('9 class easy.html') }); $('#c9e').click(function (e) { e.preventDefault(); window.location.assign('9 class hard.html') }); $('#c10e').click(function (e) { e.preventDefault(); window.location.assign('10 class easy.html') }); $('#c10h').click(function (e) { e.preventDefault(); window.location.assign('10 class hard.html') });</script> </html>
==============================================================
1 class easy
=============================================================
<!DOCTYPE html><html lang="en"> <head> <link rel="shortcut icon" href="../logo.png" type="image/x-icon"> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>QUIZ</title> <link rel="stylesheet" href="Css and Js/w3.css"> <style> body { background-color: crimson; } .container { align-items: center; background-color: rgb(240, 254, 255); box-shadow: 5px 5px 5px rgb(63, 63, 63); margin: 30px; padding: 10px; border-radius: 20px; cursor: pointer; } .mini-container { align-items: center; background-color: rgb(240, 254, 255); box-shadow: 5px 5px 5px rgb(63, 63, 63); margin: 30px; margin-left: 250px; margin-right: 250px; padding: 15px; border-radius: 20px; cursor: pointer; } </style></head> <body> <center> <!--============================= never change =============================--> <div class="home container" style="background-color: rgb(0, 26, 255);color: #fff;"> <h2>QUIZ</h2> </div> <!--============================= never change over =============================--> <div id="question" class="w3-show"> <div class="w3-content w3-yellow container w3-text-red"> <h2>Q<span id="question-number">1</span>. <span id="question-change">How many hours are there in a day</span>?</h2> <button class="w3-btn w3-purple w3-round-large w3-outline-none" id="opt1">12 hours</button> <button class="w3-btn w3-purple w3-round-large w3-outline-none" id="opt2">24 hours</button> <button class="w3-btn w3-purple w3-round-large w3-outline-none" id="opt3">48 hours</button> <button class="w3-btn w3-purple w3-round-large w3-outline-none" id="opt4">72 hours</button> </div> </div> <!-- ================ result ================= --> <div class="w3-hide" id="result"> <div class="container w3-content"> <h2 class="w3-text-red"> </h2> </div> <div class="container w3-content"> <table> <tr> <th>Total Questions </th> <th id="done">5</th> </tr> <tr> <th>Total Questions Correct</th> <th><span id="tick">0</span></th> </tr> <tr> <th>Total Questions wrong</th> <th><span id="cross">0</span></th> </tr> </table> </div> <div class="container w3-content"> <h2 class="w3-text-red"> </h2> </div> <button class="w3-outline-none w3-btn w3-green w3-xlarge w3-round-large w3-hover-orange w3-margin rebtn" id="btnre">Try Again</button> </div> </center></body><script src="Css and Js/jquery.min.js"></script><script> // document.getElementById() // ak code $('#btnre').click(function (e) { e.preventDefault(); $('#result').removeClass('w3-show'); $('#result').addClass('w3-hide'); $('#question').removeClass('w3-hide'); $('#question').addClass('w3-show'); document.getElementById('tick').innerHTML = '0'; document.getElementById('cross').innerHTML = '0'; document.getElementById('question-number').innerHTML = '0'; changequestion(); }); var que_correct = 0; var que_wrong = 0; var total_que = 1; const ans1 = '24 hours'; const ans2 = 'Arunachal pradesh'; const ans3 = 3; const ans4 = '29 days'; const ans5 = '26 letters'; $('#opt1').click(function (e) { e.preventDefault(); var a1 = document.getElementById('opt1'); var a1 = a1.innerHTML; console.log(a1); if ((a1 == ans1) || (a1 == ans2) || (a1 == ans3) || (a1 == ans4) || (a1 == ans5)) { var que_correct = document.getElementById('tick').innerHTML; var que_correct = eval(que_correct); var que_correct = eval(que_correct + 1); document.getElementById('tick').innerHTML = que_correct; changequestion(); } else { var que_wrong = document.getElementById('cross').innerHTML; var que_wrong = eval(que_wrong); var que_wrong = eval(que_wrong + 1); document.getElementById('cross').innerHTML = que_wrong; changequestion(); } }); function changequestion() { debugger var questionNumber = document.getElementById('question-number').innerHTML; console.log(questionNumber); var queno = eval(questionNumber); if (questionNumber < 5) { var queno = eval(queno + 1); document.getElementById('question-number').innerHTML = queno; document.getElementById('done').innerHTML = queno; if (queno == 1) { document.getElementById('question-change').innerHTML = 'How many hours are there in a day'; document.getElementById('opt1').innerHTML = '12 hours'; document.getElementById('opt2').innerHTML = '24 hours'; document.getElementById('opt3').innerHTML = '48 hours'; document.getElementById('opt4').innerHTML = '72 hours'; } else if (queno == 2) { document.getElementById('question-change').innerHTML = 'Which place in India is also known as “Land of Rising Sun”'; document.getElementById('opt1').innerHTML = 'Gujrat'; document.getElementById('opt2').innerHTML = 'Kerala'; document.getElementById('opt3').innerHTML = 'Ladakh'; document.getElementById('opt4').innerHTML = 'Arunachal pradesh'; } else if (queno == 3) { document.getElementById('question-change').innerHTML = 'How many zeros are there in a two-thousand rupee note'; document.getElementById('opt1').innerHTML = '4'; document.getElementById('opt2').innerHTML = '6'; document.getElementById('opt3').innerHTML = '3'; document.getElementById('opt4').innerHTML = '2'; } else if (queno == 4) { document.getElementById('question-change').innerHTML = 'How many days are there in the month of February in a leap year'; document.getElementById('opt1').innerHTML = '30 days'; document.getElementById('opt2').innerHTML = '28 days'; document.getElementById('opt3').innerHTML = '29 days'; document.getElementById('opt4').innerHTML = '31 days'; } else if (queno == 5) { document.getElementById('question-change').innerHTML = 'How many letters are there in the English alphabet'; document.getElementById('opt1').innerHTML = '10 letters'; document.getElementById('opt2').innerHTML = '30 letters'; document.getElementById('opt3').innerHTML = '18 letters'; document.getElementById('opt4').innerHTML = '26 letters'; } else { alert('question ended') } } else if (queno == 5) { $('#question').removeClass('w3-show'); $('#question').addClass('w3-hide'); $('#result').removeClass('w3-hide'); $('#result').addClass('w3-show'); } else { alert('Technical error') } } $('#opt2').click(function (e) { e.preventDefault(); var a1 = document.getElementById('opt2'); var a1 = a1.innerHTML; console.log(a1); if ((a1 == ans1) || (a1 == ans2) || (a1 == ans3) || (a1 == ans4) || (a1 == ans5)) { var que_correct = document.getElementById('tick').innerHTML; var que_correct = eval(que_correct); var que_correct = eval(que_correct + 1); document.getElementById('tick').innerHTML = que_correct; changequestion(); } else { var que_wrong = document.getElementById('cross').innerHTML; var que_wrong = eval(que_wrong); var que_wrong = eval(que_wrong + 1); document.getElementById('cross').innerHTML = que_wrong; changequestion(); } }); $('#opt3').click(function (e) { e.preventDefault(); var a1 = document.getElementById('opt3'); var a1 = a1.innerHTML; console.log(a1); if ((a1 == ans1) || (a1 == ans2) || (a1 == ans3) || (a1 == ans4) || (a1 == ans5)) { var que_correct = document.getElementById('tick').innerHTML; var que_correct = eval(que_correct); var que_correct = eval(que_correct + 1); document.getElementById('tick').innerHTML = que_correct; changequestion(); } else { var que_wrong = document.getElementById('cross').innerHTML; var que_wrong = eval(que_wrong); var que_wrong = eval(que_wrong + 1); document.getElementById('cross').innerHTML = que_wrong; changequestion(); } }); $('#opt4').click(function (e) { e.preventDefault(); var a1 = document.getElementById('opt4'); var a1 = a1.innerHTML; console.log(a1); if ((a1 == ans1) || (a1 == ans2) || (a1 == ans3) || (a1 == ans4) || (a1 == ans5)) { var que_correct = document.getElementById('tick').innerHTML; var que_correct = eval(que_correct); var que_correct = eval(que_correct + 1); document.getElementById('tick').innerHTML = que_correct; changequestion(); } else { var que_wrong = document.getElementById('cross').innerHTML; var que_wrong = eval(que_wrong); var que_wrong = eval(que_wrong + 1); document.getElementById('cross').innerHTML = que_wrong; changequestion(); } }); </script> </html><!-- @$%&-+()*"':;!?[]{}'" -->
1 note
·
View note