een quiz maken

met jQuery

radio-buttons in HTML

Maak een keuze. Jouw voorkeur is:

• Ajax
• AZ
• PSV

<ul>
 <li><input type="radio" id="k1" name="voetbal"> <label for="k1">Ajax</label></li>
 <li><input type="radio" id="k2" name="voetbal"> <label for="k2">AZ</label></li>
 <li><input type="radio" id="k3" name="voetbal"> <label for="k3">PSV</label></li>
</ul>
      

Checkbox in HTML

Wat wil je op jouw pizza?

• Mozzerella
• Tomaat
• Champignons
• Pesto
• Salami

<ul style="list-style-type:none">
  <li><input type="checkbox" id="moz"> <label for="moz">Mozzerella</label>  </li>
  <li><input type="checkbox" id="tom"> <label for="tom">Tomaat</label>      </li>
  <li><input type="checkbox" id="cha"> <label for="cha">Champignons</label> </li>
  <li><input type="checkbox" id="pst"> <label for="pst">Pesto</label>       </li>
  <li><input type="checkbox" id="sal"> <label for="sal">Salami</label>      </li>
</ul>
      

opdracht

• Download het zip-bestand van: http://bla.hosts.ma-cloud.nl/een-jquery-script-voor-quiz/
• Pas de inhoud van de 3 vragen aan zodat het Nederlandse vragen worden
• Ook de feedback naar Nederlands omzetten
• Maak de HTMl beter valide:
  • Verwijder de <br /> tussen de antwoorden en maak er <li> 's van;
  • Verberg met een stijl de list-style tekens list-style-type: none;
  • Maak van elke vraag inclusief antwoorden een <section>;
• Voeg nog een vraag toe;
• Verzin ook een vraag met afbeeldingen als labels in de antwoorden;
• Kijk of jouw quiz nog werkt.