design a layout of MCQ test and functionality using HTML, CSS, JAVASCRIPT

 Today we understand how to design a layout of MCQ Test and his functionality using HTML, CSS, JAVASCRIPT project. How to project work is shown in this video:


 





Look like this
LOGIC OF
 Next button:
First of all disable current question slide then unable next slide for representing one slide for one time.

Previous button: First of all disable current slide and then unable previous slide for representing one slide for one time.






Look like this

LOGIC OF
Save button: use query selector for which one is selected . If wright option is selected then provide question marks like 1 our as your choose. but wrong option is selected provide 0 in a variable.

Submit button: Work as well as well as next button.


LOGIC OF: 
Show button: It sum of all variable which contain each marks which collected from query selector and show it by innerHTML. 
Exit button: Refresh the web page for restart. So person attempt again MCQ Test. Here we use location.reload() JavaScript method.

We use single page for written all of the above code.

Comments

  1. Best start learningJuly 15, 2025 at 9:51 PM

    Good 👍

    ReplyDelete
  2. Best start learningJuly 15, 2025 at 10:00 PM

    Your project is good on beginner level. I wish you learn lot of thing and grow like a pro developers

    ReplyDelete

Post a Comment

Popular posts from this blog

important ideas in child development

Image
A normal family consists of  parents. parents take great care of  their children from the time they are born till the age of five to seven years, such as feeding, drinking, bathing and vaccinating them. After about five years, children start deciding their own areas like play group, likes and dislikes in food and drink, toys etc. Parents also gives them some leeway after this age. This is right in many ways because it is a part of the positive development of the child. Children participate in game and discussions and activities. All these tasks lead to physical and mental development which makes them capable of many tasks life: decision making, estimating time constraints, remembering, etc. family picture The combination of consistency  At this time children come into the zone of good company and bad company. Good company In good company, children move forward in the aspects of sports, games, education, conversation and participate in many activities, develop new aspirat...
Read more

How to make a simple calculator in c++

Image
  In this tutorial you learn how to program a simple calculator in c++ . Like given video. In this video you can understand how it works & it's functionalities: To making Like above given calculator follow given steps: 1) Make a file in any c++ program code editor( ex. calculator.cpp) 2) write code: Describing some line: #include<conio.h>, system("cls"), getch():  Is used for showing options or start program for a certain stage. Like: Options, and collect choice. Discuss code or program: 1) In main function we run a while loop for continuously run the program. 2) under the  parenthesis give value 1 . 3) And it's curly round bracket we write system("cls"). 4) Give some options when program run Like: 1) Enter 1 for + 2) Enter 2 for - 3) Enter 3 for * 4) Enter 4 for / 5) Enter 5 for exit. Defining variable, function, stop program option: i) Collect user choice in ch variable. ii) On his choice compare in if condition for run further task or quite prog...
Read more