web-dev-qa-db-ja.com

html5とjqueryを使用してWebページにpdfコンテンツを表示する方法は？

pdfドキュメントをmydiv内に表示する方法私はHTML5と jquery を使用してモバイルサイトを構築しています。 PDFドキュメントを Turnjs div内に表示する必要があります

javascriptjqueryhtmlhtml5pdf
25
raghul
<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

26
Dipak

次のコードを使用できます。

<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 embeddable PDF viewer：

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

あえて言うなら、それは非難されることを恐れての名前ですが、iframeを使用して、ブラウザがナビゲーションを提供できるようにすることもできます。

5
dove

PDFをGoogleドライブにドラッグします。次に、新しいPDF（通常はGoogleドライブの左上にあります）をクリックし、上部の共有アイコンをクリックして、advancedに移動し、 changeをクリックし、「Public」ラジオボタンがクリックされていることを確認します。 [〜＃〜] save [〜＃〜]をクリックしてから、[〜＃〜] done [〜 ＃〜]。次に、Googleドライブに戻り、pdfをクリックして開き、ポップアウトアイコン（右上、X閉じるアイコンの隣）をクリックします。 PDFが全画面表示になったら、[その他のアクション]アイコン（3つの縦のドット）をクリックします。そこに「埋め込み」の機会があります。それをクリックすると、埋め込みコードが表示されます。ほら！

注：このようにして得られたPDFは、ブログまたはHTML Webサイトに貼り付けることができ、ドキュメント内のリンクはすべて機能します!!また、ホバーすると右上に小さなポップアウトアイコンが表示され、pdfが全画面表示されます。また、ページに複数のページを配置する場合は、divにポップできます。いくつかの例は http://internetpdf.com にあります。

ジョン・バーチ

1
John Burch