使用 javascript 和 HTML 制作像 iBooks 这样的东西的最佳方法是什么？ [关闭]答案

【问题标题】：What is the best way to make something like iBooks using javascript and HTML? [closed]使用 javascript 和 HTML 制作像 iBooks 这样的东西的最佳方法是什么？ [关闭]
【发布时间】：2011-10-23 22:04:41
【问题描述】：

我想知道编写基于 JavaScript/jQuery 的解决方案以水平滚动文档文件（如 pdf、HTML 或 .doc 文件）的各个页面（.doc 文件必须是在可以在网页中查看之前转换为 pdf 或 HTML，但你明白了）。最终目标是制作像 iBooks 或真正的书，其中“页面”可以水平“翻转”而不是垂直。

到目前为止，我可以看到 3 个策略：

iframe：将 pdf、doc 转换为多个 HTML 文件。把每一“页”的将 pdf/doc 放入自己的 iframe 中，然后使用 javascript 点击 iframe 之间。
img：将 pdf,doc,html 转换为多个图像 (png,jpg) 文件。将每张图片（“页面”）放入自己的img标签中，然后使用JavaScript在imgs之间点击
div：将 pdf/doc/HTML 转换为其他文件格式，JSON？这样每个“页面”都可以放入自己的 DIV 中，然后使用 JavaScript 在 DIV 之间单击

我不想使用选项“1)”，因为 iframe 存在主要的格式问题，例如在同一个顶部窗口中有多个垂直滚动条。选项“2)”也不行，因为我希望文档的文本是可搜索的，并且将文档转换为图像会破坏该功能。我想使用选项“3）”但是，我不确定将 pdf、doc 或 HTML 文档的每个页面放入其自己的 DIV 中可能需要什么（后端文件转换，JavaScript）。可能有人知道这是如何实现的吗？任何建议将不胜感激！

【问题讨论】：

看起来同一个人在 6 小时前 Recommendation for javascript/jQuery based-horizontal scrolling of pdf, html, or .doc files in a webpage 在这里发布了基本相同的问题。投票结束这个 dup。
嗨 jfriend00，我认为你提到的问题在我写的时候太罗嗦了，想要一些更容易消化的东西，所以我更喜欢这个问题而不是前者，抱歉造成混乱，-tim跨度>
然后，您应该使用编辑链接将您之前的问题编辑为您想要的。问题只能在这里问一次。
嗨 jfriend00，我删除了你说的问题，所以现在只有这个问题。谢谢，-蒂姆

标签： javascript jquery horizontal-scrolling horizontalscrollview ibooks

【解决方案1】：

在我看来，您应该将 pdf 转换为图像和 html。

为图像制作 JS（使用带有 snap true 的 iScroll 或定位容器或使用 SwipeView - 均由 @cubiq 制作）并在图像的同一容器（每个“页面”）中，将 html 插入可见性：隐藏 div 甚至带有 text-indent:-9999px;

只有当 Js 不活跃时才优雅地降级为 html（因此考虑关闭 js 和搜索爬虫的人），使页面“可抓取”

【讨论】：