使嵌入式PDF在iPad中可滚动 [英] Make embedded PDF scrollable in iPad
问题描述
出于某种原因，iPad Safari浏览器不能很好地处理嵌入的PDF。当单独启动时，PDFs可以自行查看，但不能使用对象标签。问题是他们不滚动。
我有一个嵌入式pdf的jquery页面，它很好地滚动了mozilla和chrome，但在safari（iPad）上，PDF仍然停留在第一页，并且不可滚动。问题是，我该如何在iPad浏览器上进行这项工作？
类似的问题发布在这里使嵌入式PDF在iPad中可滚动但答案不是很好。他们使用10000px的高度作弊，这为小文档创建了大量空白，并且可能不适用于非常大的文档：
<！DOCTYPE html>
< html>
< head>
< title> PDF帧滚动测试< / title>
< script src =http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js>< / script>
< style>
#container {overflow：auto; -webkit-overflow-scrolling：touch;身高：500px; }
object {width：500px; height：10000px}
< / style>
< / head>
< body>
< div id =container>
< object id =objdata =my.pdf>对象无法呈现< / object>
< / div>
< / body>
< / html>
有什么办法可以完成这个任务而不需要硬编码一个疯狂的高度？
我已经尝试了多年寻找解决这个问题的方法。我会尽量挽救任何人寻找它的时间：这个问题没有办法解决。 Safari处理PDF渲染的方式无可避免地与将PDF嵌入到网页中的整个概念相冲突。此外，iPad上的所有浏览器都需要使用Safari渲染引擎，因此您甚至无法指示用户安装其他浏览器。
唯一方法嵌入一个PDF体面的结果是使用某种第三方渲染实用程序。这里有一些jQuery解决方案，但为了我的目的，我发现最简单的方法是在对象或iframe标记中嵌入google文档查看器链接。这样做相对简单，您可以在这里找到简单的说明：
https://docs.google.com/a/dloweb.com/viewer
此解决方案包含良好的显示渲染和简单的分页和缩放控件。如果将它嵌入到iframe或object标签中，请确保包含& embedded = true选项，否则它将无法工作。浏览器需要公开访问您的文档的URL，所以如果您有安全方面的担忧，像我一样，您需要编写一个Web服务来从单个使用令牌提供文档。
有一个很好的网页列出了其他几个选项，你应该寻找一些更强大的功能：
http://www.jqueryrain.com/2012/09/best-jquery-pdf-viewer -plugin-examples /
For some reason the iPad safari browser does not handle embedded PDFs well. PDFs view fine on their own when launched standalone, but not with the object tag. The problem is that they don't scroll.
I've got a jquery page with an embedded pdf which nicely scrolls on mozilla and chrome, but on safari (iPad) the PDF remains stuck on the first page and is not scrollable. The question is, how do I make this work on the iPad browser?
A similar question was posted here Making embedded PDF scrollable in iPad but the answer is not very good. They're cheating by using a height of 10000px, which creates a lot of whitespace for a small doc, and potentially won't work for a very large doc:
<!DOCTYPE html>
<html>
<head>
<title>PDF frame scrolling test</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<style>
#container { overflow: auto; -webkit-overflow-scrolling: touch; height: 500px; }
object { width: 500px; height: 10000px }
</style>
</head>
<body>
<div id="container">
<object id="obj" data="my.pdf" >object can't be rendered</object>
</div>
</body>
</html>
Any way to get this done without hardcoding a crazy height?
I have tried for years to find a solution to this problem. I will try to save anyone looking for it some time: THERE IS NO SOLUTION TO THIS PROBLEM. The way Safari handles PDF rendering is hopelessly in conflict with the entire concept of embedding a PDF in a webpage. Moreover, all browsers on an iPad are REQUIRED to use the Safari rendering engine, so you won't even be able to instruct users to install another browser.
The only way to embed a PDF with decent results is to use a 3rd party rendering utility of some sort. There are some jQuery solutions out there, but for my purposes, I found the simplest way to do it was to embed a google doc viewer link in an object or iframe tag. This is relatively simple to do, and you can find simple instructions here:
https://docs.google.com/a/dloweb.com/viewer
This solution includes good display rendering and simple pagination and zoom controls. Be sure to include the &embedded=true option if you are embedding it in an iframe or object tag or it won't work. The viewer requires a publicly accessible url to your document, so if you have security concerns, like me, you will need to write a web service to serve the document up from a single use token.
There is a good webpage that lists several other options should you be looking for something a little more robust:
http://www.jqueryrain.com/2012/09/best-jquery-pdf-viewer-plugin-examples/
这篇关于使嵌入式PDF在iPad中可滚动的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
