How to display pdf document inside my div. I am using HTML5 and jquery to build my mobile site. I need to display my pdf document inside a Turnjs div need to flip pages and go to specific page help me !!
如何在我的div中显示pdf文档。我正在使用HTML5和jquery来构建我的移动站点。我需要显示我的pdf文档在一个Turnjs div需要翻页和到特定的页面帮助我!
4 个解决方案
#1
25
<div>
<object data="test.pdf" type="application/pdf" width="300" height="200">
alt : <a href="test.pdf">test.pdf</a>
</object>
</div>
Read this thread - http://www.webdeveloper.com/forum/showthread.php?152923-PDF-within-a-DIV
阅读此线程:http://www.webdeveloper.com/forum/showthread.php?152923- pdf - wi- a- div。
#2
10
You can use this code:
您可以使用以下代码:
<embed src="http://domain.com/your_pdf.pdf" width="600" height="500" alt="pdf" pluginspage="http://www.adobe.com/products/acrobat/readstep2.html">
Or use Google Docs embeddable PDF viewer:
或使用谷歌文件可嵌入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
4
Dare I speak it's name for fear of being castigated, but you could use an iframe and allow the browser to provide the navigation.
我敢说它的名字是怕被批评，但你可以使用iframe并允许浏览器提供导航。
#4
1
What I do is drag the pdf to google drive. Then, click on the new pdf (it will usually be upper left in google drive), click the share icon at the top, go to advanced, then click change and make sure the "Public" radio button is clicked. Click SAVE, then click DONE. Now go back to google drive, click on the pdf to open it, then click the Pop-out icon (upper right, next to the X close icon). Once the pdf is now full screen, click the : more actions icon (three vertical dots) There you will find an "Embed" opportunity. Click that and you get the embed code. Voila!!
我要做的是将pdf拖到谷歌驱动器。然后，点击新的pdf(通常在谷歌驱动器的左上角)，点击顶部的分享图标，进入高级，然后点击change，确保“Public”单选按钮被点击。单击SAVE，然后单击DONE。现在回到谷歌驱动器，单击pdf打开它，然后单击弹出图标(右上角，X close图标旁边)。一旦pdf现在全屏，点击:更多的动作图标(三个垂直点)，你会发现一个“嵌入”的机会。单击它，您将获得嵌入代码。瞧! !
Note: The pdf gotten this way will be ready to paste into your blog or HTML website, AND any links in the document will work!! AND, there will be a little Pop-out icon in the upper right, upon hover, that makes the pdf full screen. And, you can pop it into a div if you want to put more than one on the page. Some examples are up at http://internetpdf.com.
注意:以这种方式获得的pdf将准备好粘贴到您的博客或HTML网站，并且文档中的任何链接都将有效!在右上角会有一个弹出图标，当鼠标悬停时，就会显示pdf全屏。如果你想在页面上放多个div的话，你可以把它放到div里。一些例子可以在http://internetpdf.com上找到。
John Burch
约翰。伯奇
#1
25
<div>
<object data="test.pdf" type="application/pdf" width="300" height="200">
alt : <a href="test.pdf">test.pdf</a>
</object>
</div>
Read this thread - http://www.webdeveloper.com/forum/showthread.php?152923-PDF-within-a-DIV
阅读此线程:http://www.webdeveloper.com/forum/showthread.php?152923- pdf - wi- a- div。
#2
10
You can use this code:
您可以使用以下代码:
<embed src="http://domain.com/your_pdf.pdf" width="600" height="500" alt="pdf" pluginspage="http://www.adobe.com/products/acrobat/readstep2.html">
Or use Google Docs embeddable PDF viewer:
或使用谷歌文件可嵌入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
4
Dare I speak it's name for fear of being castigated, but you could use an iframe and allow the browser to provide the navigation.
我敢说它的名字是怕被批评，但你可以使用iframe并允许浏览器提供导航。
#4
1
What I do is drag the pdf to google drive. Then, click on the new pdf (it will usually be upper left in google drive), click the share icon at the top, go to advanced, then click change and make sure the "Public" radio button is clicked. Click SAVE, then click DONE. Now go back to google drive, click on the pdf to open it, then click the Pop-out icon (upper right, next to the X close icon). Once the pdf is now full screen, click the : more actions icon (three vertical dots) There you will find an "Embed" opportunity. Click that and you get the embed code. Voila!!
我要做的是将pdf拖到谷歌驱动器。然后，点击新的pdf(通常在谷歌驱动器的左上角)，点击顶部的分享图标，进入高级，然后点击change，确保“Public”单选按钮被点击。单击SAVE，然后单击DONE。现在回到谷歌驱动器，单击pdf打开它，然后单击弹出图标(右上角，X close图标旁边)。一旦pdf现在全屏，点击:更多的动作图标(三个垂直点)，你会发现一个“嵌入”的机会。单击它，您将获得嵌入代码。瞧! !
Note: The pdf gotten this way will be ready to paste into your blog or HTML website, AND any links in the document will work!! AND, there will be a little Pop-out icon in the upper right, upon hover, that makes the pdf full screen. And, you can pop it into a div if you want to put more than one on the page. Some examples are up at http://internetpdf.com.
注意:以这种方式获得的pdf将准备好粘贴到您的博客或HTML网站，并且文档中的任何链接都将有效!在右上角会有一个弹出图标，当鼠标悬停时，就会显示pdf全屏。如果你想在页面上放多个div的话，你可以把它放到div里。一些例子可以在http://internetpdf.com上找到。
John Burch
约翰。伯奇