Include this line in your html:
<script src="https://cdn.jsdelivr.net/gh/Magoninho/quiz-generator@1.0/quiz-generator-lib/dist/Quiz.js"></script>-
Create a div that you want to insert the quiz
<div id="myQuizDiv">
</div>- Create a script for setting up the quiz
<script>
let quiz = new Quiz();
</script>Create a new quiz by instanciating a Quiz object somewhere.
- Add questions to your Quiz
// Shuffling options enabled
quiz.setShuffle(true);
/* Adding a question to the quiz
Args:
- Question name (string);
- Options (array of strings)
- Right answer index (number): that's the index of the right answer in the options array
*/
quiz.addQuestion(
"Question 1 (Shuffled)", [
"Alternative 1",
"Alternative 2",
"Alternative 3 (correct answer)",
"Alternative 4"
],
2 // Right Answer Index (Alternative 3)
);
// Shuffling options disabled
quiz.setShuffle(false);
quiz.addQuestion(
"Question 2 (Not shuffled)", [
"Alternative 1",
"Alternative 2",
"Alternative 3",
"Alternative 4",
"Alternative 5"
],
0
);- Start the quiz on a selected div
// Selecting a div to place the quiz in
let myDiv = document.getElementById("myQuizDiv");
// Starting the quiz
// Tip: you can use this in a function so you can start the quiz by pressing a button for example
quiz.start(myDiv);- You can also add sounds using
quiz.addSounds()
// Adding sounds
quiz.addSounds(
document.getElementById("audio-win"),
document.getElementById("audio-wrong")
);There are audios included in this example. Click here to see