-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
39 lines (39 loc) · 1.89 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
<!DOCTYPE html>
<head>
<meta charset="UTF-8">
<title>The Bubble Cursor</title>
<link rel="stylesheet" href="bubbleCursor.css"/>
</head>
<body>
<canvas class="canvas"></canvas>
<div class="homeExperiment">
<div class="titleExperiment">
<p class="largeText">The Bubble Cursor: Enhancing Target Acquisition by
Dynamic Resizing of the Cursor’s Activation Area
</p>
</div>
<div class="instructionExperiment">
<p class="smallText">
<span>•</span> In this experiment, we are going to test Bubble Cursor.<br>
<span>•</span> There are two types of cursor in this experiment: Bubble and Normal.<br>
<span>•</span> There are 4 blocks, 2 blocks for each type.<br>
<span>•</span> Each block has 27 trials.<br>
<span>•</span> Each trial has 9 targets in sequence (not counting the initial click).<br>
<span>•</span> A break will be held every two blocks.<br>
<span>•</span> Click on the red target at the start of each trial to begin.<br>
<span>•</span> Then move your mouse to select green circle. <br>
<span>•</span> Do it until the experiment finishes.<br>
<span>•</span> Try to select the green circles as quickly as possible.<br>
<span>•</span> It should take less than 30 minutes.<br>
<span>•</span> You can start the experiment by clicking on the below button.<br>
</p>
</div>
<div class="startExperiment">
<p class="largeText">Start</p>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript" src="bubbleCursor.js"></script>
<script type="text/javascript" src="logging.js"></script>
</body>
</html>