PDFビューアをページに埋め込む方法は？

私が間違っていない場合、Google Docsは、を介してWebページと同じサーバーに保存されているPDFを表示する手段を提供します<iframe>が、クロスブラウザーに準拠した方法でこれを行う方法を知る必要があります。

PhilipHutchisonによるPDFObjectの使用を検討できます。

または、Javascript以外のソリューションを探している場合は、次のようなマークアップを使用できます。

<object data="myfile.pdf" type="application/pdf" width="100%" height="100%">
  <p>Alternative text - include a link <a href="myfile.pdf">to the PDF!</a></p>
</object>

PDF.jsは、ネイティブコードの支援なしで忠実で効率的なPortable Document Format（PDF）レンダラーの構築を探求するHTML5テクノロジー実験です。これはコミュニティ主導であり、MozillaLabsによってサポートされています。

ここでデモを見ることができます。

これはこの方法で少しうまくいくかもしれません

<embed src= "MyHome.pdf" width= "500" height= "375">

私が間違っていなければ、OPは（後で.jsソリューションを受け入れましたが）Googleの埋め込みPDFディスプレイサーバーが自分のWebサイトにPDFを表示するかどうかを尋ねていました。

それで、1年半後：はい、そうなるでしょう。

http://googlesystem.blogspot.ca/2009/09/embeddable-google-document-viewer.htmlを参照してください。また、https：//docs.google.com/viewerを参照して、表示するファイルのURLをプラグインします。

編集：読み直して、OPはiFrameを使用しないソリューションを求めていました。グーグルのビューアではそれは不可能だと思います。

Flex Paperhttp：//flexpaper.devaldi.com/を試してみてください

それはscribdのように機能します

さまざまなリーダー設定でソリューションをテストしてください。サイト訪問者は、たとえばFirefoxでAcrobatプラグインを無効にすることにより、ブラウザではなくReader / AcrobatでPDFを開くようにブラウザを設定できます。

AdobeAcrobatとAdobeReaderのバージョンが異なるため、Firefoxが認識する2つの異なるAcrobatプラグインがあるため、結果を確認できませんが、少なくともWebサイトの訪問者がどうなるかをテストする必要があるようです。ブラウザでPDFを開かないようにブラウザが設定されています。他の方法で使用できるWebページのように見えるものを見て、ブラウザが要求していないと思われるPDFファイルを開くように要求している場合は非常に煩わしいかもしれません。PDFファイルがブラウザではなくAdobeReaderで自発的に開かれる場合もあれば、ブラウザがファイルが存在しないというダイアログを表示する場合もあります。

私はiframeとオブジェクトの両方でこのような不一致に遭遇しました。コードごとに異なる問題があります。

これは単純なHTMLコード用です。提案されたフレームワークは試していません。

私は本当にFlowPaperを選びます、特にここで見つけることができる彼らの新しい要素モード：https：//flowpaper.com/demo/

テキストをシャープに保つと同時にPDFを大幅にフラット化するため、モバイルデバイスでの読み込みがはるかに高速になります。

ブートストラップを使用すると、レスポンシブでモバイルな最初の埋め込みファイルを作成できます。

<div class="embed-responsive embed-responsive-16by9">
  <iframe class="embed-responsive-item" src="address of your file" allowfullscreen></iframe>
</div>

Aspect ratios can be customized with modifier classes.
<!-- 21:9 aspect ratio -->
<div class="embed-responsive embed-responsive-21by9">
  <iframe class="embed-responsive-item" src="..."></iframe>
</div>

<!-- 16:9 aspect ratio -->
<div class="embed-responsive embed-responsive-16by9">
  <iframe class="embed-responsive-item" src="..."></iframe>
</div>

<!-- 4:3 aspect ratio -->
<div class="embed-responsive embed-responsive-4by3">
  <iframe class="embed-responsive-item" src="..."></iframe>
</div>

<!-- 1:1 aspect ratio -->
<div class="embed-responsive embed-responsive-1by1">
  <iframe class="embed-responsive-item" src="..."></iframe>
</div>

coolwangluによるpdf2htmlEXは、おそらくpdfファイルをhtmlに変換するための最良の解決策です。簡単な変換を行ってから、htmlページをiframeなどとして埋め込むことができます。