javascript - 使用 QtWebkit (HTML/CSS/JS -> PDF) 的自动多页多列流动文本

标签 javascript css webkit pagination

我有一些 HTML 文档被转换为 PDF,使用使用 QtWebkit 呈现的软件(不确定哪个版本)。

目前,文档有特定的标签来拆分成列和页面 - 因此每当措辞发生变化时,移动这些标签以使列和页面适合是一个耗时的手动过程。

谁能提供一种方法,让文本在到达当前容器底部时自动换行到下一列/页面(视情况而定)?

QtWebkit 支持的任何 HTML、CSS 或 JS 都可以(假设它在 PDF 转换器中工作)。

(我已经在 CSS3 中测试了 webkit-column-*,看来 QtWebkit 支持这个。)

为了让事情更精彩,它还需要:
- 在每页的顶部放一个页眉,第 X 页,共 Y 页编号;
- 如果页数为奇数,则在末尾添加空白页(无页眉);
- 能够说“不要在这个 block 内中断”或“不要在这个标题之后中断”

我已经放了一些简单的例子initial markuptarget markup帮助解释我想做什么。

(实际文档远比这复杂,但在攻击真实文档之前我需要一个简单的概念验证。)

有什么建议吗?


更新:
我有一个使用 Aaron 的“填充”建议的部分工作解决方案 - 我稍后会发布更多详细信息。

最佳答案

创建一个包含单页且所有文本位于单列中的文档。使用 JavaScript 将文本分成几部分。

使用像素坐标定位不再适合的段落/元素。将它和下面的所有内容移动到下一个 col。如果一个“页面”已经有两个“col”div,开始一个新页面。

创建完所有页面后,对页面进行计数和编号。修复偶数/奇数等问题。

需要一些时间,但它是自动的。

另一种方法是将所有内容添加到“源”div 并将元素移动到 col div 直到它已满并重复下一个 col。

看看 Prototype 或 jQuery;他们应该为您提供很多工具来移动文档中的内容。

[编辑] 我建议创建一个或两个跟踪当前页面和当前列等的对象,而不是仅仅依赖于 jQuery 函数。辅助方法。

关于javascript - 使用 QtWebkit (HTML/CSS/JS -> PDF) 的自动多页多列流动文本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1294332/

相关文章:

javascript - 如何在每个帖子的左侧添加一个固定位置的框

javascript - 检测宽度 : auto in jQuery

css - 分区结合百分比和固定大小

css - 100% 高度 img 上带有父级填充的 Safari 边框高度错误

java - 带有 WEBKIT 的 SWT 浏览器高级功能

javascript - 图表.js : chart not displayed

javascript - Nodejs + Mongoose 中的异步/等待

firefox - 边框半径应该以 Firefox 方式还是以 Webkit 方式工作?

ios - 是否可以在 iOS Web 中为 -webkit-tap-highlight 的应用程序设置动画?

javascript - 开关在 JavaScript 中无法正常工作