-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
295 lines (291 loc) · 12.7 KB
/
index.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
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="styles.css" />
<title>Voice Ranger</title>
</head>
<body>
<header>
<h1>Voice Ranger</h1>
<button onclick="toggleAside()">Définitions</button>
<aside>
<h2>Définitions</h2>
<button class="close-aside">Fermer</button>
<section class="definition">
<div>
<h3>Tessiture</h3>
<div>
<h4>Soprano</h4>
<p>
La tessiture soprano est la voix la plus élevée dans la musique
vocale. Les sopranos ont généralement une gamme étendue et
peuvent atteindre des notes très aiguës. Elles sont souvent les
voix principales dans les opéras et les chœurs.
</p>
</div>
<div>
<h4>Ténor</h4>
<p>
La tessiture ténor se situe entre la voix masculine de haute
teneur et la voix de baryton. Les ténors ont une voix puissante
et sont souvent les protagonistes masculins dans les opéras.
Leur tessiture couvre généralement une gamme étendue, allant des
notes moyennement graves aux notes aiguës.
</p>
</div>
<div>
<h4>Baryton</h4>
<p>
La tessiture baryton est une voix masculine située entre la voix
de basse et la voix de ténor. Les barytons ont généralement une
voix riche et chaleureuse. Leur tessiture se situe dans une
plage moyennement grave à moyennement aiguë.
</p>
</div>
<div>
<h4>Basse</h4>
<p>
La tessiture basse est la voix masculine la plus grave dans la
musique vocale. Les basses ont une voix profonde et puissante.
Leur tessiture couvre généralement une gamme allant des notes
graves aux notes moyennement graves.
</p>
</div>
<div>
<h4>Mezzo-soprano</h4>
<p>
La tessiture mezzo-soprano est une voix féminine située entre la
voix de soprano et la voix d'alto. Les mezzo-sopranos ont une
voix légèrement plus grave que les sopranos, mais peuvent
également atteindre des notes aiguës. Leur tessiture couvre une
plage allant des notes moyennement graves aux notes moyennement
aiguës.
</p>
</div>
<div>
<h4>Alto</h4>
<p>
La tessiture alto est une voix féminine située entre la voix de
mezzo-soprano et la voix de contralto. Les altos ont une voix
plus grave que les sopranos et mezzo-sopranos, et ont souvent un
timbre riche et sombre. Leur tessiture se situe dans une plage
moyennement grave à moyennement aiguë.
</p>
</div>
<div>
<h4>Contre-ténor</h4>
<p>
La tessiture contre-ténor est une voix masculine qui est capable
de chanter dans la même gamme que les voix de mezzo-soprano ou
de contralto féminines. Les contre-ténors ont une voix légère et
agile, capable d'atteindre des notes très aiguës. Ils sont
souvent utilisés dans l'interprétation de la musique baroque.
</p>
</div>
<div>
<h4>Contralto</h4>
<p>
La tessiture contralto est une voix féminine située entre la
voix de mezzo-soprano et la voix de contralto. Les contraltos
ont une voix grave et expressive. Leur tessiture couvre
généralement une gamme allant des notes moyennement graves aux
notes moyennement aiguës.
</p>
</div>
<div>
<h4>Countertenor</h4>
<p>
La tessiture countertenor est une voix masculine qui est capable
de chanter dans une gamme similaire à celle des voix féminines
de mezzo-soprano ou de contralto. Les countertenors ont une voix
légère et souple, capable d'atteindre des notes aiguës avec
agilité. Ils sont souvent utilisés dans l'interprétation de la
musique baroque et de la musique ancienne.
</p>
</div>
<div>
<h4>Soprano léger</h4>
<p>
La tessiture soprano léger est une voix soprano avec une qualité
légère et agile. Les sopranos légers ont généralement une voix
brillante et flexible, capable d'atteindre facilement les notes
aiguës avec une agilité vocale élevée.
</p>
</div>
<div>
<h4>Soprano dramatique</h4>
<p>
La tessiture soprano dramatique est une voix soprano avec une
qualité puissante et dramatique. Les sopranos dramatiques ont
une voix riche et intense, adaptée aux rôles et aux chansons qui
nécessitent une présence vocale forte et expressive.
</p>
</div>
<div>
<h4>Mezzo-soprano léger</h4>
<p>
La tessiture mezzo-soprano léger est une voix mezzo-soprano avec
une qualité légère et agile. Les mezzo-sopranos légers ont
généralement une voix souple et expressive, capable
d'interpréter des rôles et des chansons avec virtuosité.
</p>
</div>
<div>
<h4>Mezzo-soprano dramatique</h4>
<p>
La tessiture mezzo-soprano dramatique est une voix mezzo-soprano
avec une qualité puissante et dramatique. Les mezzo-sopranos
dramatiques ont une voix riche et profonde, adaptée aux rôles et
aux chansons qui nécessitent une présence vocale forte et
émotionnelle.
</p>
</div>
</div>
<div>
<h3>Ambitus</h3>
<div>
<h4>Soprano</h4>
<p>
L'ambitus vocal de la soprano s'étend généralement de G3 à C6.
Cela signifie que sa voix peut atteindre des notes allant de G3
(la note sol grave située en dessous du Do central) à C6 (la
note Do aigu située une octave au-dessus du Do central).
</p>
</div>
<div>
<h4>Ténor</h4>
<p>
L'ambitus vocal du ténor varie généralement de C3 à C5. Cela
signifie que sa voix peut couvrir une gamme allant de C3 (la
note Do située une octave en dessous du Do central) à C5 (la
note Do située à la hauteur du Do central).
</p>
</div>
<div>
<h4>Baryton</h4>
<p>
L'ambitus vocal du baryton se situe généralement entre F2 et F4.
Cela signifie que sa voix peut s'étendre de F2 (la note Fa
située deux octaves en dessous du Do central) à F4 (la note Fa
située à la hauteur du Do central).
</p>
</div>
<div>
<h4>Basse</h4>
<p>
L'ambitus vocal de la basse s'étend généralement de E2 à E4.
Cela signifie que sa voix peut atteindre des notes allant de E2
(la note Mi située deux octaves en dessous du Do central) à E4
(la note Mi située à la hauteur du Do central).
</p>
</div>
<div>
<h4>Mezzo-soprano</h4>
<p>
L'ambitus vocal du mezzo-soprano varie généralement de A3 à A5.
Cela signifie que sa voix peut couvrir une gamme allant de A3
(la note La située une octave en dessous du Do central) à A5 (la
note La située à la hauteur du Do central).
</p>
</div>
<div>
<h4>Alto</h4>
<p>
L'ambitus vocal de l'alto se situe généralement entre F3 et F5.
Cela signifie que sa voix peut s'étendre de F3 (la note Fa
située une octave en dessous du Do central) à F5 (la note Fa
située à la hauteur du Do central).
</p>
</div>
<div>
<h4>Contre-ténor</h4>
<p>
L'ambitus vocal du contre-ténor varie généralement de G3 à D6.
Cela signifie que sa voix peut couvrir une gamme allant de G3
(la note Sol située une octave en dessous du Do central) à D6
(la note Ré située une octave au-dessus du Do central).
</p>
</div>
<div>
<h4>Contralto</h4>
<p>
L'ambitus vocal du contralto varie généralement de F3 à F5. Cela
signifie que sa voix peut couvrir une gamme allant de F3 (la
note Fa située une octave en dessous du Do central) à F5 (la
note Fa située à la hauteur du Do central).
</p>
</div>
<div>
<h4>Countertenor</h4>
<p>
L'ambitus vocal du countertenor varie généralement de G3 à D6.
Cela signifie que sa voix peut couvrir une gamme allant de G3
(la note Sol située une octave en dessous du Do central) à D6
(la note Ré située une octave au-dessus du Do central).
</p>
</div>
<div>
<h4>Soprano léger</h4>
<p>
L'ambitus vocal de la soprano léger s'étend généralement de G3 à
C6. Cela signifie que sa voix peut atteindre des notes allant de
G3 (la note sol grave située en dessous du Do central) à C6 (la
note Do aigu située une octave au-dessus du Do central).
</p>
</div>
<div>
<h4>Soprano dramatique</h4>
<p>
L'ambitus vocal de la soprano dramatique varie généralement de
C3 à C6. Cela signifie que sa voix peut couvrir une gamme allant
de C3 (la note Do située une octave en dessous du Do central) à
C6 (la note Do située à la hauteur du Do central).
</p>
</div>
<div>
<h4>Mezzo-soprano léger</h4>
<p>
L'ambitus vocal du mezzo-soprano léger varie généralement de A3
à A5. Cela signifie que sa voix peut couvrir une gamme allant de
A3 (la note La située une octave en dessous du Do central) à A5
(la note La située à la hauteur du Do central).
</p>
</div>
<div>
<h4>Mezzo-soprano dramatique</h4>
<p>
L'ambitus vocal du mezzo-soprano dramatique se situe
généralement entre F3 et F5. Cela signifie que sa voix peut
s'étendre de F3 (la note Fa située une octave en dessous du Do
central) à F5 (la note Fa située à la hauteur du Do central).
</p>
</div>
</div>
</section>
</aside>
</header>
<main>
<section>
<button onclick="showAllSingers()">Afficher tous les artistes</button>
<label for="name-select">Nom:</label>
<select id="name-select" onchange="filterSingers()">
<option disabled selected value>--Choisir un artiste--</option>
</select>
<label for="country-select">Pays:</label>
<select id="country-select" onchange="filterSingers()">
<option disabled selected value>--Choisir un pays--</option>
</select>
</section>
<section id="singers-container">
<!-- Cette div est remplie dynamiquement -->
</section>
<p id="no-singer-message">
Aucun artiste ne correspond aux critères de recherche.
</p>
</main>
</body>
<script src="app.js"></script>
</html>