Question

我正在尝试显示嵌入网页的pdf文件。我使用的是<object>标记。 pdf可以在iphone或ipad中显示。但是，我想让pdf显示填满网页的整个宽度。我无法找到有关设置移动Safari的pdf宽度的任何文档。请帮忙

<object id="objectPDF" type="application/pdf" data="pdf.pdf" width="100%" height="1000px" style="border:2px solid red; text-align:center">
<param name="view" value="fitH" valuetype="data"/>

Answer 1

你可能想把它作为一个div并取出对象标签中的宽度，

<div width="300px" height="100%">
<object id="objectPDF" type="application/pdf" data="pdf.pdf" height="1000px" style="border:2px solid red; text-align:center">
<param name="view" value="fitH" valuetype="data"/>
</div>

Answer 2

只是看着它，我会说如果你关闭</object>元素它应该有效。

为什么使用宽度和高度作为对象属性？我会用css来做它。我不认为

text-align: center

对于<object>是合适的，因为它不是HTML呈现的。里面我只是一个插件。也许这是另一件可以打破它的事情。

和@LG PDF和@Trevor Rudolph：你的<object>永远不会关闭！也许这就是为什么safari不对吗？

这也可能与pdf插件有关。这是有效的。我通过Safari上的截图服务测试了它，但移动设备是另一回事。边境怎么样？你可以看到它显示正确吗？

CSS：

.myobject {
width: 100%;
height: 1000px;
border:2px solid red;
}

HTML：

<object type="application/x-shockwave-flash" data="http://www.youtube.com/v/u1zgFlCw8Aw?fs=1" class="myobject">
<param name="movie" value="http://www.youtube.com/v/u1zgFlCw8Aw?fs=1" />
</object>

我用flash对象测试过它。不需要包装，顺便说一下。对象将采用W x H，例如<div>有效。

Answer 3

使用对象时，对我来说没有任何作用。如果使用iframe，并且应用了适当的缩放，则可以正常工作。反正不完美。

<div id="pdfVewerWrapper">
    <iframe id="pdfVewer" src="url"></iframe>
</div>

#pdfVewerWrapper {
    position: fixed;
    top:0;
    bottom:0;
    left:0;
    right:0;
    z-index: 1;
    overflow: auto;
    padding: 0;
    margin: 0;
    -webkit-overflow-scrolling: touch;
}

#pdfVewer {
    width: 595px;
    height: 20000px;
    margin: 0;
    padding: 0;
    -webkit-transform: scale(1.6);
}

如何在移动safari中设置pdf宽度

3 个答案: