/
klingon.html
111 lines (104 loc) · 4.9 KB
/
klingon.html
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
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Learn Klingon</title>
<link href="https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,700" rel="stylesheet">
<link rel="stylesheet" href="styles/style.css">
<link rel="shortcut icon" type="image/png" href="assets/favicon.png">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<main class="displayAll hideAll wrapper">
<header>
<h1>Let's Learn Klingon!</h1>
<a class="topLanguage" href="index.html">Back To Language Select</a>
</header>
<form action="">
<fieldset class="multipleChoice" id = "mp1">
<h2>What Is The Word For <em>Starship</em>?</h2>
<label for="q1One"class="label1 chosenMP not">Ghot</label>
<input class="answer1 radioHidden" type="radio" name="q1" id="q1One" data-score="0">
<label for="q1Two" class="label1 chosenMP not">Pu'HIch</label>
<input class="answer1 radioHidden" type="radio" name="q1" id="q1Two" data-score="0">
<label for="q1Three" class="label1 chosenMP not" id="correct1">EjDO</label>
<input class="answer1 radioHidden" type="radio" name="q1" id="q1Three" data-score="1">
<label for="q1Four" class="label1 chosenMP not">HoD</label>
<input class="answer1 radioHidden" type="radio" name="q1" id="q1Four" data-score="0">
</fieldset>
<!-- ...................................................-->
<fieldset class="sentence hide">
<h2>Complete the Following Sentence:</h2>
<label for="">Heghlu'meH
<input class = "answer2" type="text" name = "q2" autocomplete="off"> jajvam!
<p id="sentence">QoQ</p>
</label>
<p class="sentenceComplete"><em>Today Is A Good Day To Die!</em></p>
<label for="nextOne" class="nextOne">Next Question</label>
<input class="nextOne radioHidden" id="nextOne" type="radio">
</fieldset>
<!-- ...................................................-->
<fieldset class="imageChoice hide" id="imageChoice">
<h2>Which Image Best Represents The Word <em>YuQ</em>?</h2>
<label for="q3One" id="correct3">
<input class="radioHidden" type="radio" name="q3" id="q3One" data-score="1">
<img class="image chosen not" src="assets/planet.jpg" alt="">
</label>
<label for="q3Two">
<input class="radioHidden" type="radio" name="q3" id="q3Two" data-score="0">
<img class="image chosen not" src="assets/picard.jpg" alt="">
</label>
<label for="q3Three">
<input class="radioHidden" type="radio" name="q3" id="q3Three" data-score="0">
<img class="image chosen not" src="assets/phaser.jpg" alt="">
</label>
<label for="q3Four">
<input class="radioHidden" type="radio" name="q3" id="q3Four" data-score="0">
<img class="image chosen not" src="assets/data.jpg" alt="">
</label>
</fieldset>
<!-- ...................................................-->
<fieldset class="inputWord hide">
<h2>How Do You Say <em>"Captain"</em>?</h2>
<label for="">
<input class = "answer4" type="text" name = "q4" autocomplete="off">
</label>
<p id="inputWord">HoD</p>
<label class="nextTwo" for="nextTwo">Next Question</label>
<input class="nextTwo radioHidden" id="nextTwo" type="radio">
</fieldset>
<!-- ...................................................-->
<fieldset class="multipleChoice2 hide">
<h2>What Is The Word For <em>"Phaser"</em>?</h2>
<label for="q5One" class="label2 chosenMP not">Qel</label>
<input class="answer5 radioHidden radioHidden" type="radio" name="q5" id="q5One" data-score="0">
<label for="q5Two" class="label2 chosenMP not">Vulqan</label>
<input class="answer5 radioHidden radioHidden" type="radio" name="q5" id="q5Two" data-score="0">
<label for="q5Three" class="label2 chosenMP not">HIvje'</label>
<input class="answer5 radioHidden radioHidden" type="radio" name="q5" id="q5Three" data-score="0">
<label for="q5Four" class="label2 chosenMP not" id="correct5">Pu'HIch</label>
<input class="answer5 radioHidden radioHidden" type="radio" name="q5" id="q5Four" data-score="1">
</fieldset>
<div class="submit-container hide">
<input type="submit" class="submitScore">
</div>
</form>
</main>
<footer class="footer-height wrapper">
<div class="footer-content">
<h2 class="results"></h2>
<div class="answerOne" id="correctAnswer1"></div>
<div class="answerTwo" id="correctAnswer2"></div>
<div class="answerThree" id="correctAnswer3"></div>
<div class="answerFour" id="correctAnswer4"></div>
<div class="answerFive" id="correctAnswer5"></div>
<div class="newButtons">
<div class="restart BGNone"></div>
<div class="backToHome BGNone"></div>
</div>
</div>
</footer>
<script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>
<script src="scripts/scriptsklingon.js"></script>
</body>
</html>