-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathgeotimeline.html
124 lines (121 loc) · 6.46 KB
/
geotimeline.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
<!DOCTYPE html>
<html>
<head>
<title>Geologic Periods</title>
<!--
Objective: show the relationships (sequence and duration) of the major geological periods and significant events of each;
help order the earth's past in the minds of the readers
have one hierarchical list that will display properly without styles or javascript
show an overview strip at top
show a detail strip below that focuses on an era that is clicked in the overview (zoom in?)
-->
<link rel="stylesheet" href="geostyle.css" />
<script src="jquery.js" type="text/javascript"></script>
<script src="timeline.js"></script>
</head>
<body>
<div id="fixed-header">
<p id="caption"><span>earliest <-----</span> Earth's History (~4500 million years) <span>-----> most recent</span></p>
<div id="viewport">
<div id="horizontal-ribbon">
<p id="r-had" class="timeline hadean">Hadean</p>
<p id="r-arc" class="timeline archean">Archean</p>
<p id="r-pro" class="timeline proterozoic">Proterozoic</p>
<p id="r-cam" class="timeline cambrian">Cam</p>
<p id="r-ord" class="timeline ordovician">Ord</p>
<p id="r-sil" class="timeline silurian">Sil</p>
<p id="r-dev" class="timeline devonian">Dev</p>
<p id="r-car" class="timeline carboniferous">Car</p>
<p id="r-per" class="timeline permian">Per</p>
<p id="r-tri" class="timeline triassic">Tri</p>
<p id="r-jur" class="timeline jurassic">Jur</p>
<p id="r-cre" class="timeline cretaceous">Cre</p>
<p id="r-pal" class="timeline paleogene">Pal</p>
<p id="r-neo" class="timeline neogene">Neo</p>
<p id="r-qua" class="timeline quaternary">Qua</p>
</div>
</div>
</div>
<!--
<h1>General Geologic Divisions</h1>
<p>Scientists divide the history of the Earth into major groupings based on identifiable changes in the fossil record or rock strata.
These are known as geologic periods. ... grouped into eras, periods and epochs.</p>
<p>The Earth is about 4.7 billion years old.</p>
-->
<div id="sidebyside">
<div id="main-list">
<h2>Eons</h2>
<p class="fineprint">[ <span id="showall" class="button">Show All</span> | <span id="hideall" class="button">Hide All</a></span> ] [ <span id="make-plain" class="button">View Plain List</span> ]</p>
<ol id="eons">
<li class="era"><dt class="precambrian">Precambrian</dt><dd class="about shown">Long ago and poorly understood, mostly the domain of unicellular life.</dd>
<ol>
<li class="period"><dt class="hadean">Hadean</dt><dd class="shown">About the Hadean</dd></li>
<li class="period"><dt class="archean">Archean</dt><dd class="shown">About the Archean</dd></li>
<li class="period"><dt class="proterozoic">Proterozoic</dt><dd class="shown">Ediacaran fauna</dd></li>
</ol>
</li>
<li class="era"><dt class="phanerozoic">Phanerozoic ("visible life")</dt><dd class="shown">Contains the eras shown in the graph below.</dd>
<ol>
<li class="era"><dt class="paleozoic">Paleozoic<span class="transl"> ("ancient life")</span></dt>
<dd class="about shown">marine invertebrates</dd>
<ol>
<li class="period"><dt class="cambrian">Cambrian</dt>
<dd class="shown"><p class="timespan">542 - 488 million years ago</p>
<p class="about">multicellular life arises? witnessed radiation of new life forms</p></dd></li>
<li class="period"><dt class="ordovician">Ordovician</dt>
<dd class="shown"><p class="timespan">488 - 444 million years ago</p><p class="about">first vertebrates: fish</p></dd></li>
<li class="period"><dt class="silurian">Silurian</dt>
<dd class="shown"><p class="timespan">444 - 416 (395) million years ago</p><p class="about">land plants</p></dd></li>
<li class="period"><dt class="devonian">Devonian</dt>
<dd class="shown"><p class="timespan"> 416 - 359 (345) million years ago</p><p class="about">amphibians, insects</p></dd></li>
<li class="period"><dt class="carboniferous">Carboniferous</dt>
<dd class="shown"><p class="timespan"> 359 - 299 (280) million years ago</p></dd></li>
<li class="period"><dt class="permian">Permian</dt>
<dd class="shown"><p class="timespan">299 - 251 (225) million years ago</p><p class="about">reptiles</p></dd></li>
</ol>
</li>
<li class="era"><dt class="mesozoic">Mesozoic<span class="transl"> ("middle life")</span></dt>
<dd class="about shown">Gymnosperms (conifers, cycads, ginkgoes)</dd>
<ol>
<li class="period"><dt class="triassic">Triassic</dt><dd class="shown"><p class="timespan">251 - 200 million years ago</p><p class="about">early dinosaurs, mammal-like reptiles</p></dd></li>
<li class="period"><dt class="jurassic">Jurassic</dt><dd class="shown"><p class="timespan">200 - 145 million years ago</p><p class="about">flying reptiles, first birds</p></dd></li>
<li class="period"><dt class="cretaceous">Cretaceous</dt><dd class="shown"><p class="timespan">145 - 65 million years ago</p><p class="about">end of dinosaurs</p></dd></li>
</ol>
</li>
<li class="era"><dt class="cenozoic">Cenozoic<span class="transl"> ("recent life")</span></dt>
<dd class="about shown">The Cenozoic is the most recent geologic era, including the present epoch, the Holocene(?)</dd>
<ol>
<li class="period"><dt class="paleogene">Paleogene</dt><dd class="shown"><p class="timespan">65 - 23 million years ago</p><p class="about">hello mammals. flowering plants (angiosperms) proliferate. subdivided into several Epochs</p></dd>
<ol>
<li class="epoch">Paleocene</li>
<li class="epoch">Eocene</li>
<li class="epoch">Oligocene</li>
</ol>
</li>
<li class="period"><dt class="neogene">Neogene</dt><dd class="shown"><p class="timespan">23 - 2.6 million years ago</p><p class="about">More of the same</p></dd>
<ol>
<li class="epoch">Miocene</li>
<li class="epoch">Pliocene</li>
</ol>
</li>
<li class="period"><dt class="quaternary">Quaternary</dt><dd class="shown"><p class="timespan">2.6 million years ago - present</p><p class="about">contains the Pleistocene and Recent epochs, featuring humans</p></dd>
<ol>
<li class="epoch">Pleistocene</li>
<li class="epoch">Holocene</li>
</ol>
</li>
</ol>
</li>
</ol>
</li>
</ol>
</div></div>
<br style="clear:both" />
<h2>Additonal Sources, Links, References</h2>
<ul id="links">
<li><a href="http://pubs.usgs.gov/gip/2008/58/">USGS Spiral of Time</a></li>
<li><a href="http://www.pbs.org/wgbh/nova/evolution/brief-history-life.html">NOVA interactive timeline</a></li>
<li><a href="http://www.chronos.org">CHRONOS website, tower of time?</a></li>
<li><a href="http://paleobiology.si.edu/geotime/main/index.html">Smithsonian: National Museum of Natural History timeline (in Flash)</a></li>
</ul></body>
</html>