Как отобразить pdf-контент на веб-странице с помощью html5 и jquery?

Ответ 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

Ответ 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>

Ответ 3

Разве я говорю это имя из страха быть избитым, но вы можете использовать iframe и разрешить браузеру предоставлять навигацию.

Ответ 4

Что я делаю, это перетащить файл pdf на Google. Затем нажмите на новый pdf (обычно он будет слева вверху на диске Google), щелкните значок общего доступа вверху, перейдите в расширенный, затем нажмите изменить и сделайте убедитесь, что нажата кнопка "Общественный". Нажмите СОХРАНИТЬ, затем нажмите СОВЕРШЕННО. Теперь вернитесь на Google Drive, нажмите на pdf, чтобы открыть его, затем нажмите значок Pop-out (вверху справа, рядом с значком X закрыть). После того, как PDF теперь будет полноэкранным, нажмите значок: больше действий (три вертикальные точки). Там вы найдете возможность "Вставить". Нажмите это, и вы получите код для встраивания. Вуаля!!

Примечание: PDF файл, полученный таким образом, будет готов вставить в ваш блог или HTML-сайт, и любые ссылки в документе будут работать! И, в верхнем правом углу, при наведении курсора, появится маленький значок всплывающего окна, который сделает весь экран в формате pdf. И вы можете поместить его в div, если хотите разместить несколько страниц на странице. Некоторые примеры приведены на http://internetpdf.com.

Джон Берч