<style>body{ margin:0px; display: block; } *{ box-sizing: border-box; } .quizbox-3schools{ max-width: 800px; margin:20px auto; padding: 40px 39px;text-align:center;border-radius: 10px; border:2px solid #0000ff; background-color:#adba1a; box-shadow:0 0 4px #000; } .quiz-home-box{ display:none;} .quiz-home-box.show{ display: block; } .qbtn{ padding: 12px 35px; color: #ffffff; background-color:#0077ff; border: 2px solid #000000; font-size: 20px; border-radius: 5px; font-family: 'Montserrat', sans-serif; cursor: pointer; white-space: nowrap; margin: 0 10px; } .qbtn:focus{ outline:none; } .quiz-box{ display: none; } .quiz-box.show{ display: block; } .quiz-box .setting-3schools{ display: flex; flex-wrap: wrap; justify-content: space-between; font-size: 30px; text-transform: none; color: #000; } .quiz-box .setting-3schools .quiz-time{ flex-basis: calc(50% - 20px); max-width: calc(50% - 20px); text-align: left; } .quiz-box .setting-3schools .time-up-text{ color:#d23723; font-weight: 500; display: none; } .quiz-box .setting-3schools .time-up-text.show{ display:inline-block; animation: fadeInOut 1s linear infinite; } @keyframes fadeInOut{ 0%{ opacity: 0; } 50%{ opacity: 1; } 100%{ opacity: 0; } } .quiz-box .setting-3schools .quiz-time .remaining-time{ height: 60px; width: 60px; color:#059e4c; border: 2px solid #059e4c; background-color: #fff; font-weight: 800; line-height: 56px; text-align: center; border-radius: 50%; display:inline-block; } .quiz-box .setting-3schools .quiz-time .remaining-time.less-time{ color:#d23723; border-color:#d23723; } .quiz-box .setting-3schools .score-board{ flex-basis: calc(50% - 20px); max-width: calc(50% - 20px); text-align: right; } .quiz-box .setting-3schools .score-board .correct-answer{ font-weight: 800; } .quiz-box .question-box{ background-color:#ffffff;padding: 25px 30px; margin-top:35px; border-radius: 10px; border:2px solid #000000; text-align: center; position: relative; } .quiz-box .question-box .current-question-num{ height: 55px; width: 90px; background-color:#ffffff; border:2px solid #000000; font-size: 20px; font-weight: 800; color:#000000; border-radius:8px; line-height: 50px; text-align: center; position: absolute; top:-95px; left:50%; margin-left: -35px; z-index:1; } .quiz-box .question-box .question-text{ font-size:22px; font-family: 'Concert One', cursiv; color:#000000; } .quiz-box .answerBox{ display: flex; flex-wrap: wrap; justify-content: space-between; } .quiz-box .answerBox .option{ background-color:#ffffff; flex-basis: calc(50% - 20px); max-width: calc(50% - 20px); margin-top: 30px; padding: 7px 7px; text-align: center; font-size: 20px; text-transform: none; font-weight: 500; color:#000000; border:2px solid #000000; border-radius:8px; cursor: pointer; position: relative; animation: zoomIn .4s linear forwards; opacity: 0; } @keyframes zoomIn{ 0%{ transform: scale(0.7); } 100%{ transform: scale(1); opacity:1; } } .quiz-box .answerBox .option.already-answered{ pointer-events: none; } .quiz-box .answerBox .option.show-correct{ background-color: #11c466; border-color:#059e4c; color: #ffffff; animation: zoomIn 1.9s linear forwards; } .quiz-box .answerBox .option.correct{ background-color: #11c466; border-color:#059e4c; color:#ffffff; opacity:1; animation: pulse 1s infinite; } @keyframes pulse{ 0%{ transform: scale(1); } 50%{ transform: scale(1.1); } 100%{ transform: scale(1); } } .quiz-box .answerBox .option.correct::before{ background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGG9WEgzh0tPM4x8kj2E329glsbs-NuKkg3O8EdfM2mz99NiNoxoe1AWGn6HYIKmK4zXbepaHOw4xsJgA0BjLLDEXAcE8w9QlFteXdIhft4Ns8CqgGBFy_3uD2-uhOjtewYWPZdI_b3PA/s0/right1.png"); background-size:20px; background-position:center; background-repeat: no-repeat; content: ''; position: absolute; height: 30px; width: 30px; right: 15px; top:4px; } .quiz-box .answerBox .option.wrong{ background-color: #f85943; border-color:#d23723; color: #ffffff; opacity:1; animation: shake 1.7s infinite; } .quiz-box .answerBox .option.wrong::before{ background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzdq5TfDm_7o9jWxXTOF384YZR0O1BxjP2j7XAU9TAEwVzBJk2PenUEZcglgRT8K-njBRICPoTd5silzYhFfy1DW2x65Zmxxw5fGn8FuQ1NaxLphO2Y97cf0RoQ1p9WuCc8so5PP-UbqY/s0/wrong.png"); background-size:20px; background-position:center; background-repeat: no-repeat; content: ''; position: absolute; height: 30px; width: 30px; right: 15px; top:4px; } @keyframes shake{ 0%,30%,50%{ transform: translateX(10px); } 20%,40%{ transform: translateX(-10px); } 60%{ transform: translateX(-7px); } 70%{ transform: translateX(7px); } 80%{ transform: translateX(-4px); } 90%{ transform: translateX(4px); } 100%{ transform: translateX(0px); } } .quiz-box .answer-description{ background-color: #ffffff; border:2px solid #c2af91; margin-top: 20px; padding: 15px; border-radius:10px; color; #555555; display: none; } .quiz-box .answer-description.show{ display: block; } .quiz-box .next-question{ margin-top: 20px; text-align: center; } .see-result-btn,.next-question-btn{ display: none; } .see-result-btn.show, .next-question-btn.show{ display: inline-block; } .quiz-over-box{ text-align: center; display: none; } .quiz-over-box.show{ display: block; } .quiz-over-box h1{ font-size:50px; font-family: 'Concert One', cursive; color: #f70b0b; margin:0px 3px 20px; } .quiz-over-box h4{ font-size:25px; font-weight: normal; color: #0910f7; margin: 15px 0 20px; } .quiz-over-box h4 span{ font-weight: 800; color:#000; } .start-again-quiz-btn, .go-home-btn{ margin-top: 15px; } @media (max-width: 767px){ .qbtn{ padding: 10px 20px; font-size: 15px; } .quiz-box .question-box{ padding: 30px 5px; margin-top:10px; } .quiz-box .question-box .question-text{ font-size: 16px; } .quizbox-3schools{ padding: 30px 10px 50px; } .quiz-box .setting-3schools .quiz-time { flex-basis: calc(60% - 10px); max-width: calc(60% - 10px); font-size: 18px; } .quiz-box .setting-3schools .score-board{ flex-basis: calc(40% - 10px); max-width: calc(40% - 10px); font-size: 18px; } .quiz-box .question-box .current-question-num{ height: 30px; width: 85px; line-height: 30px; top: -14px; margin-left: -30px; font-size: 16px; } .quiz-box .answerBox .option{ flex-basis: 100%; max-width: 100%; font-size: 16px; margin-top: 15px; } .quiz-over-box h1{ font-size: 20px; } .quiz-over-box h4{ font-size: 20px; margin: 10px 0 15px; } }</style>
<div class="quiz-home-box quizbox-3schools show"><button class="start-quiz-btn qbtn" type="button">Start The Quiz</button></div><div class="quiz-box quizbox-3schools"><div class="setting-3schools"><div class="quiz-time"><div class="remaining-time"></div><span class="time-up-text">Time's Up</span></div><div class="score-board"><span class="score-text">score:</span><span class="correct-answer"></span></div></div><div class="question-box"><div class="current-question-num"></div><div class="question-text"></div></div><div class="answerBox"></div><div class="answer-description"></div><div class="next-question"><button class="next-question-btn qbtn" type="button">Next question</button><button class="see-result-btn qbtn" type="button">See Your Result</button></div></div><div class="quiz-over-box quizbox-3schools"><h1 class="apuRM"></h1><h4>Total Questions: <span class="total-questions"></span></h4><h4>Attempt: <span class="total-attempt"></span></h4><h4>Correct: <span class="total-correct"></span></h4><h4>Wrong: <span class="total-wrong"></span></h4><h4>Percentage: <span class="percentage"></span></h4><button class="start-again-quiz-btn qbtn" type="button">Start Again</button><button class="go-home-btn qbtn" type="button">Go To Home</button></div>
<script>
const _0x3ddb=['floor','random','.total-wrong','164036dcqVXI','length','47488abnSpW','.remaining-time','undefined','.correct-answer','.start-quiz-btn','.answerBox','.total-attempt','Ok,\x20But\x20You\x20Need\x20To\x20Do\x20Better.','toFixed','push','children','417333wIHRFc','14GAAMsO','\x20/\x20','.quiz-box','onclick','.go-home-btn','213pphNTF','remove','Good,\x20Don\x27t\x20Stop\x20Studying.','already-answered','description','.percentage','Not\x20good,\x20You\x20Need\x20To\x20Do\x20Better\x20!','innerHTML','animationDelay','149725zzCKpl','.answer-description','Very\x20good,\x20Don\x27t\x20Stop\x20Studying.','show','Excellent\x20,\x20You\x20Have\x20Really\x20Good\x20Knowledge\x20.','.question-text','.start-again-quiz-btn','question','classList','click','createElement','.next-question-btn','div','add','answer','option','206078WVMbbS','options','show-correct','addEventListener','.apuRM','.quiz-over-box','373EuQAnQ','11023RGfNXO','setAttribute','.time-up-text','.total-questions','.current-question-num','style','correct','querySelector','wrong'];const _0x24848a=_0x40d6;(function(_0x168950,_0x29fdef){const _0x3f7445=_0x40d6;while(!![]){try{const _0x3d74c4=parseInt(_0x3f7445(0x20b))*-parseInt(_0x3f7445(0x1f1))+-parseInt(_0x3f7445(0x1ff))+-parseInt(_0x3f7445(0x219))+-parseInt(_0x3f7445(0x229))+parseInt(_0x3f7445(0x1fd))+parseInt(_0x3f7445(0x210))*parseInt(_0x3f7445(0x1f0))+parseInt(_0x3f7445(0x20a));if(_0x3d74c4===_0x29fdef)break;else _0x168950['push'](_0x168950['shift']());}catch(_0x3d88dc){_0x168950['push'](_0x168950['shift']());}}}(_0x3ddb,0x19325));const questionText=document[_0x24848a(0x1f8)](_0x24848a(0x21e)),optionBox=document['querySelector'](_0x24848a(0x204)),currentQuestionNum=document['querySelector'](_0x24848a(0x1f5)),answerDescription=document[_0x24848a(0x1f8)](_0x24848a(0x21a)),nextQuestionBtn=document[_0x24848a(0x1f8)](_0x24848a(0x224)),correctAnswers=document[_0x24848a(0x1f8)](_0x24848a(0x202)),seeResultBtn=document[_0x24848a(0x1f8)]('.see-result-btn'),remainingTime=document[_0x24848a(0x1f8)](_0x24848a(0x200)),timeUpText=document['querySelector'](_0x24848a(0x1f3)),quizHomeBox=document['querySelector']('.quiz-home-box'),quizBox=document[_0x24848a(0x1f8)](_0x24848a(0x20d)),quizOverBox=document[_0x24848a(0x1f8)](_0x24848a(0x1ef)),startAgainQuizBtn=document[_0x24848a(0x1f8)](_0x24848a(0x21f)),goHomeBtn=document[_0x24848a(0x1f8)](_0x24848a(0x20f)),startQuizBtn=document[_0x24848a(0x1f8)](_0x24848a(0x203));let attempt=0x0,questionIndex=0x0,score=0x0,number=0x0,myArray=[],interval;function load(){const _0x544d66=_0x24848a;number++,questionText['innerHTML']=qBook[questionIndex][_0x544d66(0x220)],creatOptions(),scoreBoard(),currentQuestionNum['innerHTML']=number+_0x544d66(0x20c)+qBook['length'];}function creatOptions(){const _0x365260=_0x24848a;optionBox[_0x365260(0x217)]='';let _0xa4492d=0.2;for(let _0x4bce69=0x0;_0x4bce69<qBook[questionIndex][_0x365260(0x22a)][_0x365260(0x1fe)];_0x4bce69++){const _0x18343c=document[_0x365260(0x223)](_0x365260(0x225));_0x18343c[_0x365260(0x217)]=qBook[questionIndex]['options'][_0x4bce69],_0x18343c[_0x365260(0x221)][_0x365260(0x226)](_0x365260(0x228)),_0x18343c['id']=_0x4bce69,_0x18343c[_0x365260(0x1f6)][_0x365260(0x218)]=_0xa4492d+'s',_0xa4492d=_0xa4492d+0.2,_0x18343c[_0x365260(0x1f2)](_0x365260(0x20e),'check(this)'),optionBox['appendChild'](_0x18343c);}}function generateRandomQuestion(){const _0x2bf244=_0x24848a,_0x24b502=Math[_0x2bf244(0x1fa)](Math[_0x2bf244(0x1fb)]()*qBook['length']);let _0x1be593=0x0;if(myArray['length']==0x0)questionIndex=_0x24b502;else{for(let _0xf2ec1=0x0;_0xf2ec1<myArray[_0x2bf244(0x1fe)];_0xf2ec1++){_0x24b502==myArray[_0xf2ec1]&&(_0x1be593=0x1);}if(_0x1be593==0x1){generateRandomQuestion();return;}else questionIndex=_0x24b502;}myArray[_0x2bf244(0x208)](_0x24b502),load();}function check(_0x352e7b){const _0x2ba6ab=_0x24848a,_0x1ce4f0=_0x352e7b['id'];if(_0x1ce4f0==qBook[questionIndex][_0x2ba6ab(0x227)])_0x352e7b['classList'][_0x2ba6ab(0x226)](_0x2ba6ab(0x1f7)),score++,scoreBoard();else{_0x352e7b[_0x2ba6ab(0x221)][_0x2ba6ab(0x226)](_0x2ba6ab(0x1f9));for(let _0x2bc157=0x0;_0x2bc157<optionBox['children'][_0x2ba6ab(0x1fe)];_0x2bc157++){optionBox['children'][_0x2bc157]['id']==qBook[questionIndex]['answer']&&optionBox['children'][_0x2bc157][_0x2ba6ab(0x221)][_0x2ba6ab(0x226)]('show-correct');}}attempt++,disableOptions(),showAnswerDescription(),showNextQuestionBtn(),stopTimer(),number==qBook[_0x2ba6ab(0x1fe)]&&quizOver();}function timeIsUp(){const _0x1444a6=_0x24848a;showTimeUpText();for(let _0x5ef475=0x0;_0x5ef475<optionBox[_0x1444a6(0x209)][_0x1444a6(0x1fe)];_0x5ef475++){optionBox[_0x1444a6(0x209)][_0x5ef475]['id']==qBook[questionIndex][_0x1444a6(0x227)]&&optionBox['children'][_0x5ef475]['classList'][_0x1444a6(0x226)](_0x1444a6(0x1ec));}disableOptions(),showAnswerDescription(),showNextQuestionBtn(),number==qBook[_0x1444a6(0x1fe)]&&quizOver();}function disableOptions(){const _0x5e18c1=_0x24848a;for(let _0x181631=0x0;_0x181631<optionBox[_0x5e18c1(0x209)][_0x5e18c1(0x1fe)];_0x181631++){optionBox[_0x5e18c1(0x209)][_0x181631][_0x5e18c1(0x221)][_0x5e18c1(0x226)](_0x5e18c1(0x213));}}function showAnswerDescription(){const _0x124e80=_0x24848a;typeof qBook[questionIndex][_0x124e80(0x214)]!==_0x124e80(0x201)&&(answerDescription['classList'][_0x124e80(0x226)](_0x124e80(0x21c)),answerDescription[_0x124e80(0x217)]=qBook[questionIndex][_0x124e80(0x214)]);}function hideAnswerDescription(){const _0x14d12f=_0x24848a;answerDescription[_0x14d12f(0x221)][_0x14d12f(0x211)](_0x14d12f(0x21c)),answerDescription['innerHTML']='';}function showNextQuestionBtn(){const _0xb35a44=_0x24848a;nextQuestionBtn[_0xb35a44(0x221)][_0xb35a44(0x226)](_0xb35a44(0x21c));}function _0x40d6(_0x446d02,_0x3396a2){return _0x40d6=function(_0x3ddb45,_0x40d642){_0x3ddb45=_0x3ddb45-0x1ec;let _0x39292c=_0x3ddb[_0x3ddb45];return _0x39292c;},_0x40d6(_0x446d02,_0x3396a2);}function hideNextQuestionBtn(){const _0x44e9ef=_0x24848a;nextQuestionBtn[_0x44e9ef(0x221)][_0x44e9ef(0x211)]('show');}function showTimeUpText(){const _0x18fb7a=_0x24848a;timeUpText[_0x18fb7a(0x221)]['add'](_0x18fb7a(0x21c));}function hideTimeUpText(){const _0x5f33ec=_0x24848a;timeUpText[_0x5f33ec(0x221)][_0x5f33ec(0x211)](_0x5f33ec(0x21c));}function scoreBoard(){const _0x26477c=_0x24848a;correctAnswers[_0x26477c(0x217)]=score;}nextQuestionBtn['addEventListener'](_0x24848a(0x222),nextQuestion);function nextQuestion(){generateRandomQuestion(),hideNextQuestionBtn(),hideAnswerDescription(),hideTimeUpText(),addTimer();}function quizResult(){const _0x2ba5a3=_0x24848a;document['querySelector'](_0x2ba5a3(0x1f4))[_0x2ba5a3(0x217)]=qBook[_0x2ba5a3(0x1fe)],document[_0x2ba5a3(0x1f8)](_0x2ba5a3(0x205))[_0x2ba5a3(0x217)]=attempt,document[_0x2ba5a3(0x1f8)]('.total-correct')['innerHTML']=score,document[_0x2ba5a3(0x1f8)](_0x2ba5a3(0x1fc))[_0x2ba5a3(0x217)]=attempt-score;const _0x307855=score/qBook[_0x2ba5a3(0x1fe)]*0x64,_0x459176=_0x307855[_0x2ba5a3(0x207)](0x2);document['querySelector'](_0x2ba5a3(0x215))[_0x2ba5a3(0x217)]=_0x459176+'%';const _0x199066=document[_0x2ba5a3(0x1f8)](_0x2ba5a3(0x1ee));if(_0x459176>=0x64)_0x199066['innerHTML']=_0x2ba5a3(0x21d);else{if(_0x459176>=0x5a)_0x199066['innerHTML']='Nice,\x20You\x20Have\x20Really\x20Good\x20Knowledge\x20.';else{if(_0x459176>=0x3c)_0x199066[_0x2ba5a3(0x217)]=_0x2ba5a3(0x21b);else{if(_0x459176>=0x28)_0x199066[_0x2ba5a3(0x217)]=_0x2ba5a3(0x212);else _0x459176>=0x14?_0x199066[_0x2ba5a3(0x217)]=_0x2ba5a3(0x206):_0x199066[_0x2ba5a3(0x217)]=_0x2ba5a3(0x216);}}}}function resetQuiz(){attempt=0x0,score=0x0,number=0x0,myArray=[];}function quizOver(){const _0x227109=_0x24848a;nextQuestionBtn['classList']['remove'](_0x227109(0x21c)),seeResultBtn[_0x227109(0x221)][_0x227109(0x226)](_0x227109(0x21c));}seeResultBtn[_0x24848a(0x1ed)]('click',()=>{const _0x318847=_0x24848a;quizBox['classList'][_0x318847(0x211)](_0x318847(0x21c)),seeResultBtn[_0x318847(0x221)][_0x318847(0x211)]('show'),quizOverBox[_0x318847(0x221)][_0x318847(0x226)](_0x318847(0x21c)),quizResult();}),startAgainQuizBtn[_0x24848a(0x1ed)]('click',()=>{const _0x547385=_0x24848a;quizBox['classList'][_0x547385(0x226)](_0x547385(0x21c)),quizOverBox[_0x547385(0x221)]['remove']('show'),resetQuiz(),nextQuestion();}),goHomeBtn['addEventListener'](_0x24848a(0x222),()=>{const _0x387c9e=_0x24848a;quizOverBox[_0x387c9e(0x221)][_0x387c9e(0x211)](_0x387c9e(0x21c)),quizHomeBox[_0x387c9e(0x221)][_0x387c9e(0x226)]('show'),resetQuiz();}),startQuizBtn[_0x24848a(0x1ed)](_0x24848a(0x222),()=>{const _0x478055=_0x24848a;quizHomeBox[_0x478055(0x221)][_0x478055(0x211)]('show'),quizBox['classList']['add'](_0x478055(0x21c)),nextQuestion();});
qBook=[
{question:`আমাদের জাতীয় পশুর নাম কি ?`,options:[`সিংহ`,`বাঘ `,`হাতি`,`কুকুর`],answer:1 }]
function addTimer(){let timeLimit=45;remainingTime.innerHTML=timeLimit;remainingTime.classList.remove("less-time");interval=setInterval(()=>{timeLimit--;if(timeLimit < 10){timeLimit="0"+timeLimit;}if(timeLimit < 10){ remainingTime.classList.add("less-time");}remainingTime.innerHTML=timeLimit;if(timeLimit == 0){clearInterval(interval);timeIsUp();}},1000)}function stopTimer(){clearInterval(interval);}
</script>