-
Notifications
You must be signed in to change notification settings - Fork 0
/
analysis.liquid
82 lines (68 loc) · 2.38 KB
/
analysis.liquid
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
<!DOCTYPE html>
<html lang="en">
{% capture baseRoot %}
{% relativeUrl "/" %}{% endcapture %}
<head>
<link rel="stylesheet" href={{baseRoot | append: "/css/slideshow.css" }} />
<link rel="stylesheet" href={{baseRoot | append: "/css/header.css"}} />
<link rel="stylesheet" href={{baseRoot | append: "/css/footer.css"}} />
<meta charset="utf-8" />
<title>Orphan Train Passengers</title>
<script>
// Used for the slideshow features
let slideIndex = 1;
// Next/previous controls
function moveSlides(n) {
showSlides(slideIndex += n);
}
// Thumbnail image controls
function showSlides(n) {
let i;
let slides = document.getElementsByClassName("slide");
if (n > slides.length) {
slideIndex = 1
}
if (n < 1) {
slideIndex = slides.length
}
for (i = 0; i < slides.length; i++) {
slides[i].style.display = "none";
}
slides[slideIndex - 1].style.display = "block";
}
// load the picture at the beginning of the site
window.onload = function() {
showSlides(slideIndex);
};
</script>
</head>
<body>
{% comment %}
This contains all photos and links to the pages
{% endcomment %}
{% render 'header', urlRoot: baseRoot %}
<div class="slideshow-wrapper">
<button class="prev" onclick="moveSlides(-1)">❮</button>
<button class="next" onclick="moveSlides(1)">❯</button>
<div class="slide">
<div class="counter">1/3</div>
<img src={{ baseRoot | append: "/images/Children_Age_Gender-resized.webp" }} alt="Age and Gender Percentages of Children in Nebraska" />
</div>
<div class="slide">
<div class="counter">2/3</div>
<img src={{ baseRoot | append: "/images/Age_Breakdown-resized.webp" }} alt="Age Percentages of Children in Nebraska" />
{% comment %}
<p class="caption">Robert Panzer, New York, 1921.</p>
{% endcomment %}
</div>
<div class="slide">
<div class="counter">3/3</div>
<img src={{ baseRoot | append: "/images/Gender_Breakdown-resized.webp" }} alt="Gender Percentages of Children in Nebraska" />
{% comment %}
<p class="caption">Harold Panzer, New York, 1921.</p>
{% endcomment %}
</div>
</div>
{% render 'footer', urlRoot: baseRoot %}
</body>
</html>