-
Notifications
You must be signed in to change notification settings - Fork 5
/
index.html
250 lines (250 loc) · 10.2 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<link rel="stylesheet" media="screen" href="css/general.css">
<link rel="stylesheet" media="screen" href="css/b1njTimeline.css">
<title>B1nj Timeline. Simple Timeline html/css/javascript</title>
</head>
<body>
<div id="page">
<h1>B1nj Timeline (plugin jQuery)</h1>
<p>Design by and css inspired <a href="http://csswizardry.com/2011/03/coding-up-a-semantic-lean-timeline/">@csswizardry HTML/CSS timeline</a></p>
<ol id="timeline1">
<li>
<time datetime="1991-10-01">October 1991</time>
<p>Birth</p>
<div class="description">
<ul>
<li>Met my mom</li>
<li>Met my dad</li>
</ul>
</div>
</li>
<li>
<time datetime="1994-10">October 1994</time>
<p>Back to School!</p>
</li>
<li>
<time datetime="2001-09-11">Septembre 11 2001</time>
<p>World Trade Center</p>
</li>
<li>
<time datetime="2003">2003</time>
<p>My adolescent crisis</p>
</li>
<li>
<time datetime="2005-08">August 2005</time>
<p>Fun under the sun</p>
</li>
<li>
<time datetime="2009-06-19">June 19 2009</time>
<p>I miss homework...not!</p>
</li>
<li>
<time datetime="2010-06-22">June 22 2010</time>
<p>I have my degree!</p>
</li>
<li>
<time datetime="2010-08-16">August 2010</time>
<p>That's it, I'm finally a man.</p>
</li>
<li>
<time datetime="2012-01-11">January 11 2012</time>
<p>Signing unemployment checks</p>
</li>
<li>
<time datetime="2013-03">Mars 2013</time>
<p>My first job</p>
</li>
</ol>
<h2><a href="http://a.bouque.free.fr/invent/even1900_1949.htm">Evénements historiques 1900-1949</a></h2>
<ol id="timeline2">
<li>
<time datetime="1900">1900</time>
<p>La population mondiale atteint 1,625 milliard.</p>
<div class="description">
<ul>
<li>En 2013 elle est de 7 milliards</li>
</ul>
</div>
</li>
<li>
<time datetime="1900">1900</time>
<p>L'Autrichien Sigmund Freud fonde la spychanalyse.</p>
</li>
<li>
<time datetime="1901">1901</time>
<p>Mort de la reine Victoria</p>
<div class="description">
<p>Mort de la reine Victoria, au pouvoir en Angleterre depuis 1837</p>
</div>
</li>
<li>
<time datetime="1903">1903 </time>
<p>1er Tour de France cycliste.</p>
</li>
<li>
<time datetime="1904">1904</time>
<p>Début des travaux du canal de Panama</p>
<div class="description">
<p> Achevé dix ans plus tard, il relie le Pacifique à la mer des Caraïbes.</p>
</div>
</li>
<li>
<time datetime="1905">1905</time>
<p>Albert Einstein publie ses théories de la relativité</p>
<div class="description">
<p>Le physicien allemand Albert Einstein publie ses théories de la relativité et l'équivalence de la masse et de l'énergie (E=Mc²)</p>
</div>
</li>
<li>
<time datetime="1906">1906 </time>
<p>Division de l'Inde et création de l'état musulman du Pakistan.</p>
</li>
<li>
<time datetime="1912-4-14">1912 14-15 Avril</time>
<p>Tragédie du titanic.</p>
</li>
<li>
<time datetime="1914">1914</time>
<p>L'Europe s'embrase, la frappe de l'or est arrétée.</p>
<div class="description">
<p>L'Allemagne, l'Autriche, la Turquie et la Hongrie combattent une coalition de Français, de Britanniques, d'Italiens et de Russes.</p>
</div>
</li>
<li>
<time datetime="1917">1917</time>
<p>Les Etats-Unis entre en guerre.</p>
</li>
<li>
<time datetime="1917">1917</time>
<p>La révolution d'Octobre en Russie : les Bolcheviques prennent le pouvoir à Pétrograd.</p>
</li>
<li>
<time datetime="1917">1917</time>
<p> Fin de la guerre - le 11 Novembre l'Armistice est signèe</p>
<div class="description">
<p>La Première Guerre mondiale a fait 10 millions de victimes.</p>
</div>
</li>
<li>
<time datetime="1917">1917</time>
<p>Les femmes britanniques ont le droit de vote.</p>
</li>
<li>
<time datetime="1920">1920</time>
<p>La fabrication, le transport et la vent d'alcool sont interdits aux Etats-Unis</p>
<div class="description">
<p>c'est la "prohibition". La contrebande entraine des luttes sans merci au sein des gangs.</p>
</div>
</li>
<li>
<time datetime="1920">1920</time>
<p>En Allemagne Adolf Hitler crée le parti nazi (national-socialiste).</p>
</li>
<li>
<time datetime="1922">1922</time>
<p>Découverte de la tombe de Toutankhamon.</p>
</li>
<li>
<time datetime="1923">1923</time>
<p>Inflation vertigineuse en Allemagne</p>
<div class="description">
<p> les billets de banque ne valent plus rien, on les utilise même pour allumer les poêles.</p>
</div>
</li>
<li>
<time datetime="1923">1923</time>
<p>Création d'Interpol</p>
</li>
<li>
<time datetime="1926">1926</time>
<p>Naissance du Commonwealth</p>
<div class="description">
<p>(les anciennes colonies de l'Empire Britanique deviennent des états indépendant et souverains).</p>
</div>
</li>
<li>
<time datetime="1926">1926</time>
<p>Redressement du franc grâce au gouvernement Poincaré.</p>
<div class="description">
<p>c'est la "prohibition". La contrebande entraine des luttes sans merci au sein des gangs.</p>
</div>
</li>
<li>
<time datetime="1929">1929</time>
<p>Le Krach de Wall Street</p>
<div class="description">
<p>effondrement de la bourse New-Yorkaise à des répercussion internationales</p>
</div>
</li>
<li>
<time datetime="1930">1930</time>
<p>L'astronome américain Clyde Tombaugn découvre la neuvième planète du système solaire : Pluton</p>
</li>
<li>
<time datetime="1933">1933</time>
<p>Victoire du Front Populaire en Juin</p>
<div class="description">
<p>Léon Blum mêne an France d'énormes réformes sociales.</p>
</div>
</li>
<li>
<time datetime="1933">1933</time>
<p>La monarchie Anglaise est scandalisée</p>
<div class="description">
<p> Edouart VII est épris de Wallis Simpson, une femme divorcée. Pour pouvoir vivre son amour, le roi d'Angleterre abdique en faveur de son frère Georges VI.</p>
</div>
</li>
<li>
<time datetime="1933-06">1933</time>
<p>Camps de concentration nazi</p>
<div class="description">
<p>En Allemagne, le parti nazi construit des camps de concentration o² sont enfermés les juifs, les homosexuels et les gitans.</p>
</div>
</li>
<li>
<time datetime="1939">1939</time>
<p>Deuxiéme Guerre Mondiale</p>
<div class="description">
<p>Adolf Hitler ordonne à ses troupes d'envahir la Pologne et provoque la Deuxiéme Guerre Mondiale.</p>
</div>
</li>
<li>
<time datetime="1940-6">1940</time>
<p>Le Général de Gaulle appelle les Français à la Résistance.</p>
</li>
<li>
<time datetime="1944">1944</time>
<p>Paris libèré, le Général de Gaulle descend les Champs Elysées</p>
</li>
<li>
<time datetime="1944">1944</time>
<p>Circulation de billets Américains libellés en Francs.</p>
</li>
<li>
<time datetime="1945">1945</time>
<p>La France élit une assemblée constituante. Les femmes votent pour la première fois.</p>
</li>
<li>
<time datetime="1946">1946</time>
<p>La france adopte la constitution de la IVème République.</p>
</li>
</ol>
</div>
<script src="js/jquery-1.8.0.min.js"></script>
<script src="js/moment.min.js"></script>
<script src="js/jquery.b1njTimeline.js"></script>
<script>
$(function() {
$('#timeline1').b1njTimeline({
'height' : 600
});
$('#timeline2').b1njTimeline({
'height' : 1500
});
});
</script>
</body>
</html>