SKIP TO CONTENT

אפליקציית החידון האינטראקטיבית הראשונה שלכם

beginner~15 דק׳0/4 שלבים

אפליקציית החידון האינטראקטיבית הראשונה שלכם

הרצאה היא תקשורת חד-כיוונית. חידון הוא שיחה.

תלמידים שבוחנים את עצמם זוכרים 50% יותר מאלה שרק קוראים שוב את החומר. בשיעור הזה תבנו אפליקציית חידון אמיתית ולחיצה — עם שאלה, אפשרויות תשובה שנצבעות בירוק או באדום בלחיצה, מונה ניקוד והודעת תוצאה. הכול רץ בדפדפן. בלי פריימוורקים, בלי צד שרת. רק HTML + קצת JavaScript.

הוראות

1

הוסיפו <h1> עם כותרת החידון — על איזה נושא החידון בוחן?

רמז: נסו: `<h1 class="text-3xl font-bold text-white mb-2">בדיקת ידע מהירה</h1>`

2

הוסיפו <div class="question"> שמכיל את טקסט שאלת החידון

3

הוסיפו לפחות 3 כפתורי תשובה <button class="answer-btn">. סמנו את התשובה הנכונה עם data-correct="true"

4

הוסיפו <div class="score-counter"> בתחתית שמציג "ניקוד: 0" — ה-JavaScript שבקוד ההתחלה יעדכן אותו אוטומטית בלחיצה על התשובה הנכונה

הקוד שלכם

html
37 שורות
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37

תצוגה חיה

תצוגה חיה