如何在纯HTML5 / CSS / Jquery中显示epub格式书 [英] How do I display epub format book in pure HTML5/CSS/Jquery

问题描述

是否可以使用纯HTML5，CSS和Jquery在Web浏览器中显示epub格式的书籍？任何人请请建议我该怎么做？我还必须让这个响应能够使其在iPad上工作。我知道，但我不知道如何使用HTML和Javascript阅读epub。

Is it possible to display epub format books in web browser using pure HTML5, CSS and Jquery? Could anybody please suggest how do I do this? I have to also make this responsive to be able to make it work on iPad. I know that but I don't know how do I read the epub using HTML and Javascript.

epub可能包含一些数学函数，我需要正确显示它们

The epub may contain some mathematical functions and I need to display them properly too.

推荐答案

可以使用纯HTML5，CSS和jQuery？

Is it possible to display epub format books in web browser using pure HTML5, CSS and jQuery?

是的，可以。

写一个epub阅读器？

Why do you want to write an epub reader? There are already many out there.

在任何情况下，您的问题是一般问题的具体形式，是否可以为epub编写电子书阅读器？显然，是的，可能已经写了。如果你可以用一种语言或一个平台编写它，你可以写在另一个或另一个。

In any case, your question is a specific form of the generic question, is is possible to write an an ebook reader for epubs? Obviously, yes it is, may have been written. If you can write it in one language or for one platform, you can write it in or for another.

但实际上，你甚至不需要写一个读者，因为epubs只是一个罐中的小网站。将epub文件解压缩到服务器上的某个位置，然后将浏览器导航到其中一个页面。 Voila，你在读。你想要一个目录？

But actually, you don't even need to write a reader, since epubs are just little websites in a can. Unzip the epub file somewhere on your server, and navigate the browser to one of the pages. Voila, you're reading. You want a table of contents? Navigate to the toc.xhtml or equivalent file and there you go.

从一个页面移动到下一个页面怎么办？你需要知道页面应该显示在什么顺序。写一个小的服务器组件，它解析文件通常称为content.opf，并基于清单元素中的文件的顺序，发出一些HTML前进和后退按钮和iframe以显示内容。当你在它，解析出标题和其他有趣的元数据。所有这些基本上是epubjs的作用。

What about moving from one page to the next? You'll need to know what order the pages are supposed to be displayed in. Write a small server component which parses the file normally called content.opf, and based on the order of the files in the manifest element, emit some HTML which has a forward and back button and an iframe to show the content. While you're at it, parse out the title and other interesting metadata. All this is essentially what epubjs does.

但是我直觉从你的问题，你想完全在客户端/浏览器端。好吧，也已经做了，以Readium的形式，你应该看看。使用你最喜欢的JS解压缩库（警告，可以慢）来解压缩epub文件，并写一些JS来解析元数据和抛出页面，再次最有可能在iframe中使用一些chrome。

But I intuit from your question that you want to do this entirely on the client/browser side. Well, that too has already been done, in the form of Readium, which you should take a look at. Use your favorite JS unzipping library (warning, can be slow) to unzip the epub file, and write a bit of JS to parse the metadata and throw up the pages, again most likely in iframes with some chrome around them.

但是，如果你想要分页输出，人们对电子书阅读器有什么期望呢？这是什么地方开始变得毛茸茸，可能是一个好地方退后，再问问自己一次，为什么你这样做。无论如何，如果你决定你真的想要分页显示，那么你将需要找出一些逻辑的组合，涉及窗口，框架，剪切，偏移和/或使用地区帮助你在这里。一些电子书阅读器只是在这里，而且说，滚动/未标记的输出有什么问题吗？

But what if you want paginated output, which people have come to expect from ebook readers? This is where things start to get hairy, and is probably a good place to step back and ask yourself once again why you're doing this. Anyway, if you decide you really want paginated display, then you're going to need to figure out some combination of logic involving windowing, framing, clipping, offsetting, and/or using "regions" to help you here. Some ebook readers just punt here, and say, what's wrong with scrolled/unpaginated output anyway?

但电子书阅读器做很多其他的事情。例如，大多数会允许您更改行间距，边距或字体大小。这些用户设置如何与书的CSS文件中的样式进行交互？有些读者采用解析CSS的方法（也有库），并重写它以获得您或您的用户想要的结果。

But ebook readers do many other things. For instance, most would allow you to change line spacing, or margins, or font sizes. How do these user settings interact with the styling in the book's CSS files? Some readers take the approach of parsing the CSS (there are libraries for that too) and rewrite it to get the results you or your user wants.

浏览器应用程序？

你必须担心许多其他事情，才能成为一个合格的读者。刚刚离开我的头顶部，包括显示一些书指定的指南或地标，记住从会话到会话的阅读位置和用户选项，并且可能提供某种书架功能。

You're going to have to worry about many, many other things to make a competent reader. Just off the top of my head, that includes displaying the "guide" or "landmarks" some books specify, remembering reading location and user options from session to session, and probably providing some kind of bookshelf functionality.

虽然一些客户端电子书阅读器使用jQuery，但请记住，因为epub是HTML5 / CSS2.5 / JS，内容本身只能通过现代浏览器可靠地显示。但是如果你有一个新的浏览器，你不需要90％的头发在jQuery是设计用于跨浏览器兼容性。你最好用更轻的组件，如Backbone和/或Underscore。您可能甚至不需要选择器库，因为您将有querySelector。

Although some client-side ebook readers do use jQuery, keep in mind that since epubs are HTML5/CSS2.5/JS, the content itself can only be reliably displayed by a modern browser. But if you have a modern browser, you don't need 90% of the hair in jQuery which is designed for cross-browser compatibility. You'd be better off with more lightweight components, such as Backbone and/or Underscore. You probably don't even need a selector library, since you'll have querySelector.

祝你好运！

这篇关于如何在纯HTML5 / CSS / Jquery中显示epub格式书的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！