如何使用html5和jquery在網頁中顯示pdf內容？

Question

如何在我的div中顯示pdf文檔。 我正在使用HTML5和jquery來構建我的移動網站。 我需要在Turnjs div中顯示我的pdf文檔需要翻頁並轉到特定頁面

Answer 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

Answer 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>

Answer 3

我敢說它的名字是因為害怕受到嚴厲懲罰，但你可以使用iframe並允許瀏覽器提供導航。

Answer 4

我所做的是將pdf拖到谷歌驅動器。 然后，單擊新的pdf（它通常位於谷歌驅動器的左上角），單擊頂部的共享圖標，轉到高級 ，然后單擊更改並確保單擊“公共”單選按鈕。 單擊“ 保存” ，然后單擊“ 完成” 。 現在返回谷歌驅動器，點擊pdf打開它，然后單擊彈出圖標（右上角，X關閉圖標旁邊）。 一旦pdf現在全屏，單擊：更多操作圖標（三個垂直點）在那里您將找到“嵌入”機會。 單擊它，您將獲得嵌入代碼。 瞧！

注意：以這種方式獲得的pdf將准備好粘貼到您的博客或HTML網站中，並且文檔中的任何鏈接都可以使用!! 並且，在懸停時，右上方會有一個Pop-out圖標，使pdf全屏顯示。 並且，如果您想在頁面上放置多個，則可以將其彈出為div 。 http://internetpdf.com上有一些例子。

約翰伯奇