【问题标题】:How to display pdf content in web page using html5 and jquery?如何使用 html5 和 jquery 在网页中显示 pdf 内容?
【发布时间】:2012-10-16 13:19:23
【问题描述】:

如何在我的 div 中显示 pdf 文档。我正在使用 HTML5jquery 来构建我的移动网站。我需要在 Turnjs div 中显示我的 pdf 文档 需要翻页并转到特定页面

【问题讨论】:

  • 您想在 div 中嵌入 Adob​​e Reader?

标签: javascript jquery html pdf


【解决方案1】:
<div>
<object data="test.pdf" type="application/pdf" width="300" height="200">
alt : <a href="test.pdf">test.pdf</a>
</object>
</div> 

阅读此主题 - http://www.webdeveloper.com/forum/showthread.php?152923-PDF-within-a-DIV

【讨论】:

【解决方案2】:

您可以使用此代码:

<embed src="http://domain.com/your_pdf.pdf" width="600" height="500" alt="pdf" pluginspage="http://www.adobe.com/products/acrobat/readstep2.html">

或使用 Google Docs 可嵌入 PDF 查看器:

<iframe src="http://docs.google.com/gview?url=http://domain.com/your_pdf.pdf&embedded=true" 
style="width:600px; height:500px;" frameborder="0"></iframe>

【讨论】:

  • 在桌面浏览器中运行良好,但在移动浏览器中无法正常运行...如何使其在移动浏览器中运行?
【解决方案3】:

我敢说它的名字怕被骂,但你可以使用 iframe 并允许浏览器提供导航。

【讨论】:

    【解决方案4】:

    我所做的是将 pdf 文件拖到谷歌驱动器。然后,点击新的pdf(通常在google drive的左上角),点击顶部的分享图标,进入advanced,然后点击change并制作确保单击“公共”单选按钮。点击保存,然后点击完成。 现在回到谷歌驱动器,点击pdf打开它,然后点击弹出图标(右上角,X关闭图标旁边)。 pdf 现在全屏后,单击 : more actions 图标(三个垂直点)在那里您将找到“嵌入”机会。单击它,您将获得嵌入代码。瞧!!

    注意:通过这种方式获得的 pdf 可以粘贴到您的博客或 HTML 网站中,并且文档中的任何链接都可以使用!!并且,右上方会有一个小弹出图标,悬停时,会使pdf全屏显示。而且,如果您想在页面上放置多个,可以将其弹出到 div 中。一些示例位于http://internetpdf.com

    约翰·伯奇

    【讨论】:

    • 我觉得应该是评论
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2019-11-13
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-11-01
    相关资源
    最近更新 更多