-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathexample.html
88 lines (78 loc) · 3.87 KB
/
example.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
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>Org Inline Footnotes</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<meta name="generator" content="Org-mode" />
<meta name="author" content="Vesa Vänskä ~ @vesan" />
<link rel='stylesheet' type='text/css' href='org-inline-footnotes.css'>
<script src="jquery-2.0.3.min.js"></script>
<script src="jquery-inline-footnotes.js"></script>
</head>
<body>
<div id="content">
<h1 class="title">Org Inline Footnotes</h1>
<script>
$(function() {
var fns=$('.footdef');
$.each(fns, function(i, fn){
$(fn).attr("id", "fn."+(i+1));
});
$(".footref").inlineFootnote();
});
</script>
<style type="text/css">
body
{
color: #555;
padding: 0;
margin: 0;
margin-left:auto;
margin-right:auto;
font-size: 26px;
}
#content
{
width: 660px; margin: 76px auto;
color:#555;
font-family: "Garamond Premier Pro", Georgia, serif;
line-height: 1.6em;
}
h1,h2,h3,h4,h5,h6
{
font-family: 'Helvetica Neue', Helvetica, Arial, 'Lucida Grande', sans-serif;
font-weight: 700;
text-rendering:optimizeLegibility;
}
</style>
<div id="outline-container-sec-1" class="outline-2">
<h2 id="sec-1">Alice’s dream</h2>
<div class="outline-text-2" id="text-1">
<p>
Alice was beginning to get very tired of sitting by her sister on the bank, and of having nothing to do: once or twice she had peeped into the book her sister was reading, but it had no pictures or conversations in it, ‘and what is the use of a book,’ thought Alice ‘without pictures or conversation?’ <sup><a id="fnr.1" name="fnr.1" class="footref" href="#fn.1">1</a></sup> <br />
</p>
</div>
</div>
<div id="outline-container-sec-2" class="outline-2">
<h2 id="sec-2">The Rabbit</h2>
<div class="outline-text-2" id="text-2">
<p>
So she was considering in her own mind (as well as she could, for the hot day made her feel very sleepy and stupid), whether the pleasure of making a daisy-chain would be worth the trouble of getting up and picking the daisies, when suddenly a White Rabbit with pink eyes ran close by her.<sup><a id="fnr.2" name="fnr.2" class="footref" href="#fn.2">2</a></sup> <br />
</p>
<p>
There was nothing so VERY remarkable in that; nor did Alice think it so VERY much out of the way to hear the Rabbit say to itself, ‘Oh dear! Oh dear! I shall be late!’ (when she thought it over afterwards, it occurred to her that she ought to have wondered at this, but at the time it all seemed quite natural); but when the Rabbit actually TOOK A WATCH OUT OF ITS WAISTCOAT-POCKET, and looked at it, and then hurried on, Alice started to her feet, for it flashed across her mind that she had never before seen a rabbit with either a waistcoat-pocket, or a watch to take out of it, and burning with curiosity, she ran across the field after it, and fortunately was just in time to see it pop down a large rabbit-hole under the hedge.<sup><a id="fnr.3" name="fnr.3" class="footref" href="#fn.3">3</a></sup> <br />
</p>
</div>
</div>
<div id="footnotes">
<h2 class="footnotes">Footnotes </h2>
<div id="footnote">
<div class="footdef"><sup><a id="fn.1" name="fn.1" class="footnum" href="#fnr.1">1</a></sup> <p>This is the first paragraph.</p></div>
<div class="footdef"><sup><a id="fn.2" name="fn.2" class="footnum" href="#fnr.2">2</a></sup> <p>This is where the second footnote goes.</p></div>
<div class="footdef"><sup><a id="fn.3" name="fn.3" class="footnum" href="#fnr.3">3</a></sup> <p>There is a third footnote here.</p></div>
</div>
</div></div>
</body>
</html>