view<...">
Best IT Recipes

How to display a word document using fancybox.

HTML code

<div class='case'> <a href="http://localhost/DXXX/case/reqirement.doc" rel="case"> view</a> </div>

JQuery code

  $(".case").live('click',function(){ $.fancybox({ opeEffect:'elastic closeEffect:'elastic' }); } );

It indicates that the requested content cannot be downloaded. Please try again later. And I get the download of this document file ... How can I display a document file using fancybox

+3
jquery fancybox
Feb 23 '12 at 18:20
source share
4 answers

You can not. Browsers do not have a built-in way to view Word documents, so if the user has not configured their browser to open it using some plug-in (which was not in 99% of the world), the browser will offer them to download the file.

+4
Feb 23 '12 at 18:24
source share

UPDATE: January 29, 2017

Google Docs Viewer allows a Word document to be perceived as a document (read-only), rather than an image (as it worked previously), so you can actually select and copy from the displayed document to another document.

Added by JSFIDDLE with Fancybox v2.1.5



The only possible way to do this without all the problems mentioned above is to use the Google document viewer to display the image of the file through an iframe ... so this script:

  $(document).ready(function() { $ ( "" ). FancyBox ({ 'width': 600,// -  'height': 320, 'type': 'iframe' }); });//  >

with this html:

  < a class= "word" href= "http://docs.google.com/gview?url=http://domain.com/path/docFile.doc&embedded=true" >     fancybox </a> >

... should do the trick.

Just note that you are not actually opening a Word document, but an image of it that will work if you want to show only the contents of the document.

By the way, I noticed that you should use fancybox v2.x. In this case, you don’t need the .live() method at all, since fancyBox v2 already uses "live" to process clicks.

+14
Feb 23 2018-12-12T00:
source share

As far as I know, you will need some kind of plugin that will know how to handle this type of MIME. Other than that it is impossible.

The same applies to any type of file ...

0
Feb 23 '12 at 18:22
source share

You can use this code, short and sweet (with the latest version of Fancybox) -

 $.fancybox.open({ padding: 0, href: $url, type: 'iframe', });

If your $ url might be something like

 https://docs.google.com/viewer?url=<url for your file>&embedded=true
0
Dec 23 '16 at 21:02
source share


More articles:


All Articles