_Header.md
... ...
@@ -3,10 +3,27 @@
3 3
<img alt="A man moving his hands away from his forehead sideways, in a mind-explosion gesture. An overlaid animation enforces the explosion character" width="500" height="300" src="https://media1.giphy.com/media/2rqEdFfkMzXmo/giphy.gif?cid=790b76118e85130b6027e42ff5aca28cf62871c4e09f8306&rid=giphy.gif&ct=g">
4 4
--->
5 5
6
+<div class="image biblio_theorie">
7
+<div class="content">
8
+<img src="media/images/Header_1_vectorized.png" style="background-color: transparent;" alt="theory">
9
+</div>
10
+</div>
11
+
12
+<div class="image biblio_histoire">
13
+<div class="content">
14
+<img src="media/images/Header_2_vectorized.png" style="background-color: transparent;" alt="history">
15
+</div>
16
+</div>
17
+
18
+<div class="image biblio_militantisme">
19
+<div class="content">
20
+<img src="media/images/Header_3_vectorized.png" style="background-color: transparent;" alt="militant">
21
+</div>
22
+</div>
6 23
7 24
<p>
8
-<a href="./"><button class="button_header button_home" style="float: left; margin: 0px 0px;" >Home</button></a>
9
-<a href="/biblio_theorie.md"><button class="button_header button_theory" onclick="window.location.href='';" style="float: right;">Theory</button></a>
25
+<a href="./"><button class="button_header button_home" style="float: left; margin: 0px 0px;" >Accueil</button></a>
26
+<a href="/biblio_theorie.md"><button class="button_header button_theory" onclick="window.location.href='';" style="float: right;">Theoriez</button></a>
10 27
<button class="button_header button_militant" onclick="window.location.href='';" style="float: right;">Militantisme</button>
11
-<button class="button_header button_history" onclick="window.location.href='';" style="float: right;">History</button>
28
+<button class="button_header button_history" onclick="window.location.href='';" style="float: right;">Histoire</button>
12 29
</p>
biblio_theorie.md
... ...
@@ -3,9 +3,7 @@ title: Bibliographie - Théorie et Pensées
3 3
---
4 4
5 5
<div class="tooltip">
6
-<p align="center">
7
-<img src="media/images/Header_1_vectorized.png" style="background-color: transparent;">
8
-</p>
6
+
9 7
<span class="tooltiptext">
10 8
Précisions sur les théories et les pensées qui inspirent et façonnent notre manière de voir les choses.
11 9
</span>
custom.js
... ...
@@ -52,4 +52,48 @@ window.onload = function() {
52 52
document.getElementById('drag-img').addEventListener('mousedown', start_drag);
53 53
document.getElementById('container').addEventListener('mousemove', while_drag);
54 54
document.getElementById('container').addEventListener('mouseup', stop_drag);
55
+
56
+
57
+
58
+ // Show filtered elements
59
+
60
+
61
+ function filterSelection(page) {
62
+ var images, i;
63
+ images = document.getElementsByClassName("image");
64
+
65
+ for (i = 0; i < images.length; i++) {
66
+ w3RemoveClass(images[i], "show");
67
+ if (images[i].className.indexOf(page) > -1) w3AddClass(images[i], "show");
68
+ }
69
+ }
70
+
71
+ function w3AddClass(element, name) {
72
+ var i, arr1, arr2;
73
+ arr1 = element.className.split(" ");
74
+ arr2 = name.split(" ");
75
+ for (i = 0; i < arr2.length; i++) {
76
+ if (arr1.indexOf(arr2[i]) == -1) {
77
+ element.className += " " + arr2[i];
78
+ }
79
+ }
80
+ }
81
+
82
+ // Hide elements that are not selected
83
+ function w3RemoveClass(element, name) {
84
+ var i, arr1, arr2;
85
+ arr1 = element.className.split(" ");
86
+ arr2 = name.split(" ");
87
+ for (i = 0; i < arr2.length; i++) {
88
+ while (arr1.indexOf(arr2[i]) > -1) {
89
+ arr1.splice(arr1.indexOf(arr2[i]), 1);
90
+ }
91
+ }
92
+ element.className = arr1.join(" ");
93
+ }
94
+
95
+ var path = window.location.pathname;
96
+ var page = path.split("/").pop();
97
+
98
+ filterSelection(page);
55 99
}
... ...
\ No newline at end of file