ブートストラップアコーディオン内にPDFをロード

Question

ブートストラップアコーディオン内に表示されるPDFSを読み込もうとしています。問題は、ブラウザによってさまざまな方法で読み込まれることです。私は異なる結果を持つiframeとオブジェクトhtmlタグを試していましたが、パネル内にPDFを埋め込むと、アコーディオンの機能が完全に破壊されるSafariには大きな流れがあります。

私の質問は次のとおりです。クロム、サファリ、IE11、Firefoxに埋め込みPDFの作業をするためにクロスブラウジングに関する標準がありますか？

私はモバイルで動作するためにこれが必要なので、状況はさらに悪いです。いくつかのアドバイスは本当に感謝されます。

Answer 1

クラス "panel-body"を使用してキャンバス要素を作成し、それにあなたが選択したIDを与えます。次に、ドキュメント準備完了イベントに次のコードを追加します。

PDFJS.getDocument('YOURPDF.pdf').then(function(pdf) { 
    pdf.getPage(1).then(function(page) { 
     var scale = 1; 
     var viewport = page.getViewport(scale); 
     var canvas = document.getElementById('pdfOne'); // The id of your canvas 
     var context = canvas.getContext('2d'); 
     canvas.height = viewport.height; 
     canvas.width = viewport.width; 
     var renderContext = { 
      canvasContext: context, 
      viewport: viewport 
     }; 
     page.render(renderContext); 
    }); 
}); 

最初のページがレンダリングされます。ユーザーがドキュメントをナビゲートできるようにボタンを作成する必要がありますが、私が提供したサンプルとサンプルに基づいて作業を進めるには、それは十分に簡単でなければなりません。