Question

It is possible to display a pdf inside a div using this:

<div>
    <object data="test.pdf" type="application/pdf" width="300" height="200">
    PDF : <a href="test.pdf">test.pdf</a>
    </object>
</div>

Is it possible to do something similar for a .doc or .docx? (without server side)

  • I am assuming the browser or the computer has a way of reading the data.
Was it helpful?

Solution

Might I suggest Google Doc Viewer, it'll allow you up show several types of files inline where they would normally prompted for download:

https://docs.google.com/viewer/

You can also use this inline in your own website with the use of an iframe.

Here is a list of supported file-types:

  • Microsoft Word (.DOC and .DOCX)
  • Microsoft Excel (.XLS and .XLSX)
  • Microsoft PowerPoint (.PPT and .PPTX)
  • Adobe Portable Document Format (.PDF)
  • Apple Pages (.PAGES)
  • Adobe Illustrator (.AI)
  • Adobe Photoshop (.PSD)
  • Tagged Image File Format (.TIFF)
  • Autodesk AutoCad (.DXF)
  • Scalable Vector Graphics (.SVG)
  • PostScript (.EPS, .PS)
  • TrueType (.TTF)
  • XML Paper Specification (.XPS)
  • Archive file types (.ZIP and .RAR)

I messed around with this for mobile output of PDFs but the mobile version had an error that made it impossible to use. Not sure where the development on this product has landed but the desktop version always worked very well.

OTHER TIPS

You can do this through an iframe inside the div by linking the source to the path of the file on your server.

<div>
<iframe src="mydoc.docx">myDocument</iframe>
</div>

<div>
<iframe src="mydoc.xslx">myDocument</iframe>
</div>

<div>
<iframe src="mydoc.pdf">myDocument</iframe>
</div>
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top