-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
89 lines (86 loc) · 2.04 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
<!DOCTYPE html>
<html>
<head>
<style>
#body {
background-color: rgb(0, 0, 0);
}
.dot {
text-align: center;
padding-left: 2.225cm;
padding-right: 2.225cm;
padding-top: 2cm;
padding-bottom: 2cm;
}
.one {
background-color: rgb(0, 0, 0);
border-radius: 50%;
}
.two {
background-color: rgb(0, 0, 0);
color: white;
}
.three {
border-radius: 50%;
}
.center {
margin: 200px auto;
width: 50%;
padding: 10px;
}
#answer {
background: rgb(0, 0, 0);
}
#wipeout {
z-index: 100;
position: absolute;
height: 100%;
width:100%;
background-image: url(random-squares.jpg);
top: 0;
display: none;
}
#instruction {
z-index: 100;
position: absolute;
height: 100%;
width:100%;
background-color: grey;
top: 0;
text-align: center;
font-size: 25px;
padding-top: 150px;
font-weight: bold;
color: white;
}
#results {
z-index: 103;
position: absolute;
height: 100%;
width:100%;
background-color: grey;
top: 0;
text-align: center;
font-size: 25px;
padding-top: 150px;
font-weight: bold;
color: white;
display: none;
}
</style>
<script type="text/javascript" src="index.js"></script>
</head>
<body id="body">
<div id="instruction"><p>Jums bus pateikti 12 spalvų stimulai juoduose ir baltuose fonuose.</p>
<p>Prasidėjus eksperimentui, žiūrėkite į kryželį neatitraukdami žvilgsnio. Po 30 sekundžių, spalvos stimului pradingus, jo vietoje matysite susidariusį povaizdį. Tuo metu, naudodami klavišus 'Q', 'W', 'E' ir 'A', 'S', 'D' parinkite spalvą, kuri labiausiai atitinka matomo povaizdžio spalvą. Pasirinkę spalvą, spauskite 'Space' norėdami tęsti.</p>
<p>Eksperimentui pasibaigus, matysite rezultatų lentelę.</p>
</p><p>Paspauskite 'Enter' norėdami pradėti </p></div>
<div id="wipeout"></div>
<div class="center">
<span class="dot one" id="question"></span>
<span class="dot two" id="plus">+</span>
<span class="dot three" id="answer"></span>
</div>
<div id="results"></div>
</body>
</html>