javascript - 如何在纯 HTML5/CSS/Jquery 中显示 epub 格式的书

标签 javascript jquery html css epub

是否可以使用纯 HTML5、CSS 和 Jquery 在网络浏览器中显示 epub 格式的书籍?有人可以建议我该怎么做吗?我还必须使其具有响应性才能使其在 iPad 上运行。我知道,但我不知道如何使用 HTML 和 Javascript 阅读 epub。

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

最佳答案

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

是的,这是可能的。

为什么要写epub阅读器?已经有很多了。

无论如何,您的问题是通用问题的特定形式,是否可以为 epub 编写电子书阅读器?显然,是的,可能已经写好了。如果您可以用一种语言或为一种平台编写它,那么您也可以用另一种语言或为另一种平台编写它。

但实际上,您甚至不需要编写阅读器,因为 epub 只是 jar 装的小网站。将 epub 文件解压缩到服务器上的某个位置,然后将浏览器导航到其中一个页面。瞧,你在读书。你想要目录吗?导航到 toc.xhtml 或等效文件即可。

从一页移到下一页怎么样?您需要知道页面应该以什么顺序显示。编写一个小型服务器组件来解析通常称为 content.opf 的文件,并根据 list 元素中文件的顺序发出一些 HTML,其中包含一个前进和后退按钮和一个用于显示内容的 iframe。当你在做的时候,解析出标题和其他有趣的元数据。所有这些本质上都是 epubjs 所做的。

但是我从你的问题中直觉到你想完全在客户端/浏览器端执行此操作。好吧,这也已经以 Readium 的形式完成了,您应该看一看。使用您最喜欢的 JS 解压缩库(警告,可能会很慢)解压缩 epub 文件,并编写一些 JS 来解析元数据并抛出页面,同样很可能在带有一些 chrome 的 iframe 中。

但是,如果您想要分页输出(人们对电子书阅读器的期望)怎么办?这是事情开始变得棘手的地方,可能是退后一步并再次问自己为什么要这样做的好地方。不管怎样,如果你决定你真的想要分页显示,那么你将需要找出一些涉及窗口、框架、剪辑、偏移和/或使用“区域”的逻辑组合来帮助你。一些电子书读者只是在这里发牢骚,说,滚动/未分页的输出到底有什么问题?

但是电子书阅读器还可以做很多其他事情。例如,大多数都允许您更改行间距、边距或字体大小。这些用户设置如何与本书的 CSS 文件中的样式交互?一些读者采用解析 CSS 的方法(也有相应的库)并重写它以获得您或您的用户想要的结果。

更喜欢应用程序而不是浏览器应用程序?将整个 shebang 包裹在 PhoneGap 中。

要成为一名称职的读者,您将不得不担心很多很多其他事情。就在我的脑海中,这包括显示一些书籍指定的“指南”或“地标”,记住阅读位置和 session 之间的用户选项,并可能提供某种书架功能。

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

祝你好运!

关于javascript - 如何在纯 HTML5/CSS/Jquery 中显示 epub 格式的书,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14562580/

相关文章:

javascript - 使用国家/地区代码作为数组/对象名称?范围界定问题?

javascript - Jquery float 条反转 y 轴

javascript - 跨浏览器 : Detecting scroll position JS only

javascript - Codeigniter ajax 检查电子邮件可用性

javascript - 如何仅使用 JavaScript 更改视频源

javascript - 如何将 HTML 表格转换为纯文本并将其保存到 JavaScript 中的变量中

javascript - 如何在从React渲染方法返回的元素上获取 'this'

javascript - 多复选框javascript检查状态检测

javascript - 按字母顺序对列表中的文本范围进行排序

javascript - 将 Django 模板变量替换为通过 Javascript 创建的变量