Homepage
Login
Profile
BookClubs
dmBox
I'm trying to build an interactive ebook as a single page application. Everything works fine till now, except that I couldn't find a way to create a dynamic table of contents.
My initial idea was to use the same file and specify a different hash for each chapter, like this:
<nav epub:type="toc">
<ol>
<li><a href="page.xhtml#chapter1">Chapter 1</a></li>
<li><a href="page.xhtml#chapter2">Chapter 2</a></li>
</ol>
</nav>
Inside page.xhtml I have 2 anchors with id chapter1 and chapter2. Clicking on the chapters from the TOC will jump to the correct anchor.
But the JavaScript code inside page.xhtml cannot get the fragment information from window.location how I expect it. This is what I get with Calibre Viewer:
{
"origin": "https://calibre-internal.invalid",
"hash": "",
"href": "https://calibre-internal.invalid/OEBPS/page.xhtml",
"pathname": "/OEBPS/page.xhtml",
"ancestorOrigins": {
"length": 0
},
"hostname": "calibre-internal.invalid",
"protocol": "https:",
"port": "",
"host": "calibre-internal.invalid",
"search": ""
}
I don't know why the host is calibre-internal.invalid, that would also be interesting to fix.
You can find the sample project at this location: github.com/kenjiru/epub-location-test
Here's a sample epub file: github.com/kenjiru/epub-location-test/files/1307404/sample.epub.zip
Free books android app tbrJar TBR JAR Read Free books online gutenberg
(0)More posts by @Angela
