8

简短的问题是；“我可以 - 在 Safari 中 - 在 iPad 上（仅 - 不需要其他浏览器或设备） - 放大或缩小 PDF 文档以适应固定宽度的 iframe 或对象标签吗？”

还有一个很长的问题；我有以下标记 - 用于在 DIV 中显示可滚动的 PDF。此标记将用于 iPad 的 Cordova/Phonegap 应用程序。Javascript 智能是通过 Backbone；

<div class="pdf-container-outer">
    <div class="pdf-container">
        <iframe src="..." />
    </div>
</div>

以及相关的 CSS（为了可读性而删减）；

.pdf-container-outer {
    width: 800px; 
    height: 800px; 
    overflow: scroll !important;
    -webkit-overflow-scrolling: touch; 
}

.pdf-container { 
    width: 800px; 
}

iframe { 
    width: 800px; 
}

PDF 文档本身是 A4 大小的——然后 pdf 页面的像素尺寸为 595px X 841px。在 Safari 中 - 文档始终以 '100%' 显示 - 即无论我在 iframe 上设置的宽度（或对象标签 - 结果是相同的），出现的内部 PDF 始终只有 ~595px 宽（+ 大约两边留出 7-8px 的边距）。他们不缩放。

iframe 的宽度需要根据用户是在纵向还是横向模式下查看站点来更改...横向约 800 像素，纵向约 520 像素。

鉴于我知道我正在显示的文档中的页数 - 我确实知道显示所有文档所需的 iframe 的完整尺寸。因此，我玩过的其中一项技术是使用一些内联样式设置 iframe 的大小，然后对其应用变换 - 将其放大，例如；

<iframe src="..." style="width: 610px; height: 14000px; -webkit-transform: scale(1.31); -webkit-transform-origin: top left;" />

即应用的变换将 610px 放大 131% = 800px 宽（在横向模式下）。纵向 - 比例因子约为 0.8。

这实际上在 iOS6 附带的 Safari 中运行良好，但在 iOS5.1 中不是很好 - 存在我似乎无法解决的剪辑问题 - 因此解决方案并不理想。

我确定我想多了 - 并且有一个更简单的解决方案。但是对于我的生活，我无法在 Safari 的 iframe 中获得 PDF 以横向缩放...

一点帮助？

4

0 回答 0