javascript - Google 图书动态页面

Question

我想知道是否可以做类似 this 的事情使用Javascript。我认为这是一件很难实现的事情(只需尝试调整窗口大小)，而且我不知道网络上是否有一些东西(虽然我没有找到任何东西)。

Answer 1

如果您能够将整本书的文本传递到页面，这很简单。

简单待办事项列表 (MVC)

• PHP:从 db 获取书籍并将其内容传递给 view
• 创建四个 DIV
  • 首先到上一页操作
  • 左页第二个
  • 右页第三页
  • 第四到下一页 Action

这些 DIV 是浏览器窗口的 100% 高度，它们的宽度是:

• 30px
• (page.width-60)/2
• (page.width-60)/2
• 30px

并且通过 Javascript，您只需通过计算字数将书的文本分成这么多页(例如，一页 == 200 字)

如果页面不是那么高而无法显示所有文本，让我们像在给定示例中那样垂直滚动

他们实现的更多功能是:

• 搜索(参见 javascript string.search() )
• 调整字体大小(参见 javascript css 方法或阅读 Javascript Change Font Size )
• 按章节走书(取决于您的实现 *1)
• 底部 slider (同样取决于您的实现，但 jquery slider 对此非常有用)

*1

• 你可以简单地将你的书的文本按章节数组传递给你的 View
• 您可以只传递章节并通过 AJAX 调用获取章节文本
• 或者任何你能想到的...

关于现成的实现，你可以看到这些:

• http://michaelthompson.org/books/read.php?book=b5
• http://weblogs.mozillazine.org/gerv/archives/2006/05/amazon_ajax_book_reader.html (如页面图像 - 扫描 - 实现)
• http://openlibrary.org/dev/docs/bookreader
• http://monocle.inventivelabs.com.au/ (再次扫描页面，如最终尺寸的图像)