Best IT Recipes

View PDF in a web browser

How can I display a PDF file in a web browser on an .html page?

+57
html browser pdf
Jan 31 '11 at 17:19
source share
13 answers

I am using Google Docs Embedded PDF Viewer. Docs do not need to be uploaded to Google Docs, but they must be available online.

<iframe src="http://docs.google.com/gview?url=http://path.com/to/your/pdf.pdf&embedded=true" style="width:600px; height:500px;" frameborder="0"></iframe>
+93
Jan 31 '11 at 17:33
source share

instead of using iframe and depending on third party , consider using flexpaper or pdf.js.

I used pdf.js , it works great for me.

here is a demo: http://mozilla.github.com/pdf.js/web/viewer.html

+28
Apr 6 '13 at 15:31
source share

The easiest way is to create an iframe and set the source to the URL of the PDF file.

(ducks are crazy HTML designers) I did it myself, cross browser works fine, crawls into the bunker.

+15
Jan 31 '11 at 17:30
source share

using an object tag

 <object data='http://website.com/nameoffolder/documentname.pdf#toolbar=1' type='application/pdf' width='100%' height='700px'>

note that you can change the width and height to whatever value you visit http://www.w3schools.com/tags/tag_object.asp

+7
Dec 01 '14 at 19:45
source share

The browser plugin controls these settings, so you cannot force it. However, you can make a simple <a href="whatver.pdf"> instead of <a href="whatever.pdf" target="_blank"> .

+5
Jan 31 '11 at 17:24
source share

You can also embed JavaScript through a third-party solution, such as PDFObject .

+3
Jan 31 '11 at 17:27
source share

While you are posting the PDF, the target attribute is the method. In other words, for relative files, using the target attribute with a value of _blank will work fine.

 <e> <a target="_blank" alt="StackExchange Handbook" title="StackExchange Handbook" href="pdfs/StackExchange_Handbook.pdf">StackExchange Handbook</a>

For absolute paths, the engines will go to U the desired R source L and open it. So suppress the target attribute.

 <e> <a alt="StackExchange Handbook" title="StackExchange Handbook" href="protocol://url/StackExchange_Handbook.pdf">StackExchange Handbook</a>

Browsers will rely on good work in both cases.

+3
Dec 10 '14 at 3:14
source share

You can use this code:

 <embed src="http://domain.com/your_pdf.pdf" width="600" height="500" alt="pdf" pluginspage="http://www.adobe.com/products/acrobat/readstep2.html">

Or use the Google Docs embedded 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>
+1
Oct 13 '14 at 2:47
source share

You can also use this simple GoogleDoc approach.

 <a style="color: green;" href="http://docs.google.com/gview?url=http://domain//docs/<?php echo $row['docname'] ;?>" target="_blank">View</a>

This will create a new page for viewing the document without distorting the flow.

+1
Dec 02 '16 at 12:46 on
source share

A simple solution is to place it in an iframe and hope that the user has a plug-in that supports it.

(I don’t do this, the Acrobat plugin was such a resource-consuming source and a source of instability that I draw a conclusion to remove it from any browser it touches).

A sophisticated but relatively popular solution is to display it in a flash applet.

0
Jan 31 '11 at 17:24
source share

We present pages of PDF files as PNG files on the server using JPedal (java library). This, combined with some javascript, gives us high control over visualization and navigation.

0
Jan 31 '11 at 17:31
source share

Displaying content saved in PDF / DOC / DOCX format is ideal for displaying a pdf / doc / docx file on your web page

-one
Oct 05 '16 at 14:03
source share

Have you tried using a simple img tag?

 <img scr="https://www.typomania.co.uk/pdfs/lipsum.pdf">
-one
May 10 '17 at 14:05
source share


More articles:


All Articles