There's discussion elsewhere (in the Sigil forum, I believe) about using the
footer tag to code footnotes. It's pretty theoretical, though, because no current device actually displays the footers.
One of the hopes is that it might popup a window containing the note. Anything is possible, as what the tag displays is defined by the device firmware. It could be a running footer, or whatever.
You can mimic a popup, sort of, without footer code. In my books, I code the superscripted indicator as a link, without actually superscripting (because superscripting usually makes ugly line-spacing, and it's pretty small to click on):
Code:
... As a rule, however, non-exploding projectiles are used at night." <a class="EndNoteLink" id="Link_To_Endnote_1" href="#Endnote_1">[1]</a></p>
Which links to a
<li> element named "Endnote_1", which is enclosed in a section at the end of the book called "Endnotes", defined by a
<div>. (Don't mistake the
<h2> header as defining a section. And I use the
title attribute to store the endnote count.)
Code:
<div class="Spine" id="Endnotes" title="1">
<h2>ENDNOTES</h2>
<ul>
<li id="Endnote_1">
<strong>[1]</strong> I have used the word radium in describing this powder because in the light of recent discoveries on Earth I believe it to be a mixture of which radium is the base. In Captain Carter's manuscript it is mentioned always by the name used in the written language of Helium and is spelled in hieroglyphics which it would be difficult and useless to reproduce.
<a class="EndNoteBackLink" href="#Link_To_Endnote_1">
<img class="Return" alt="Return to Link Button" src="images/return.png" />
</a>
</li>
</ul>
</div>
In my CSS, I've defined the following for images in the "Endnote"
<div>, inside an unordered list, within a
<li> element, enclosed by an anchor with the class "EndNoteBackLink":
Code:
div#Endnotes ul li a.EndNoteBackLink img {
margin-top:.25em;
margin-bottom:.25em;
display:block;
page-break-after:always;
}
Which, if you're unfamiliar with CSS, puts a page-break after the link back to the original endnote link. (I should probably just select images with the class "Return", now that I re-read it. Still, it works.)
The effect is that when you click the original link, you jump to a page that contains only the note you're trying to read. You click on the little "return" image to return to your original spot.
(The image actually says "return", just as an image -- this allows me to theme it, along with all the other images I use.)
If you're paging through the book, you will eventually come to the Endnotes section, and you can page down through the notes sequentially. Whenever you're at an endnote, you can page down (or up) as well -- you're not pinned in another document, as you might be if each endnote were its own document.
Note that my structural tagging is pretty strict: it may not suit you. The advantage is that I can automate it, and that it is readable. With everything fairly well classed, I can control layout pretty granularly. Still, to each his own: the concept should help you do what you want.
You can find the book I took this code from here. It's in XHTML, which is what ePub is based on -- conversion should be dead simple.
m a r