6

Goal : A browser base pdf viewer that has zoom and drag/ pan function (better if allow hiding the save function) to replace the browser default one

Problem : all browser (exclude old IE) has their own build in pdf viewer, that without dragging/pan function

Currently this code use default pdf viewer:

<object id = 'zoomPage' type='application/pdf' data= '1.pdf'>
   <p>The PDF can not display
   </p>
</object>

Is it possible to force all browser (Chrome , FireFox , IE8+) using the adobe reader to open pdf file using javascript / jquery / html /php? Or are there any web base pdf viewer has the functions mentioned above?

Note:

For the first approach :

I found the way e.g. content-disposition : attachment

but it only change the behavior from viewing to download the pdf , not changing the preference in opening the pdf file

Dhwani
  • 7,484
  • 17
  • 78
  • 139
user782104
  • 13,233
  • 55
  • 172
  • 312
  • 1
    Force (meaning on your own machine) or force meaning on anyone who views your PDF? On your own machine, change the file association for that mimetype to always open with Firefox and (annoyingly) you would likely lauch Firefox everytime one of your other browsers tries to open "application/pdf" files. on someone else's machine? Uh, I don't think so. I would never let JS execute on my machine at your whim and nor should anyone. – Kevin Brown Aug 22 '13 at 01:23
  • 1
    If you were able to remote select an external program my browser should use for your files, I would consider that a security hole. – mkl Aug 25 '13 at 22:02
  • If I were to visit a site, and noticed it was using their own pdf viewer, or any piece of software I didn't install/agreed to use, I'd close the browser window, and blacklist that site... I'm requesting data, not software... I want what I requested, nothing more, nothing less – Elias Van Ootegem Aug 27 '13 at 12:07

5 Answers5

7

For approach 2: (Which I recommend) Check out:

https://github.com/mozilla/pdf.js/

PDF.js is Portable Document Format (PDF) viewer that is built with HTML5.

PDF.js is community-driven and supported by Mozilla Labs. Our goal is to create a general-purpose, web standards-based platform for parsing and rendering PDFs.

EDIT: For your speed needs, check the discussion on the other options here: Recommended way to embed PDF in HTML? and see if the other options fit your requirements.

Approach 1 is inherently dicey due to security reasons

Community
  • 1
  • 1
Vrashabh Irde
  • 14,129
  • 6
  • 51
  • 103
  • thank you. This viewer is good . With pdf.js it can convert the pdf to canvas , then I can drag it. The only problem is it is more time , memory consuming and the image quality (since it is after convert) is worse than native pdf viewer – user782104 Aug 26 '13 at 10:14
  • 3
    There is a good discussion going on here: http://stackoverflow.com/questions/291813/recommended-way-to-embed-pdf-in-html see if others fit your speed needs. – Vrashabh Irde Aug 26 '13 at 11:36
  • Actually, for firefox this is the built-in PDF viewer. – puetzk Aug 27 '13 at 12:49
2

The only way you can force it client-side is by supplying the alternative...such as pdf.js, zoho, google pdf viewer, scribd, etc (there are many). I'm not sure if Adobe provides an in-browser pdf viewer like you're expecting.

The default pdf viewer is kept in a variable found in about:config that can only be changed by the user.

blakev
  • 4,154
  • 2
  • 32
  • 52
  • thanks for reply, are there any js/jquery plugin that can add drag function on a pdf viewer? I tried some of the plugin but most of them support html element e.g. drag on text/ img but not pdf viewer object. – user782104 Aug 26 '13 at 10:10
  • you can use some simple ajax tricks to make it appear that drag-drop is happening on pdf viewer. use a normal html div layer to capture the drop and then load it into pdf viewer. – Litmus Aug 30 '13 at 07:11
1

Is it possible to force all browser (Chrome , FireFox , IE8+) using the adobe reader to open pdf file using javascript / jquery / html /php?

You could try this by using an iframe pointing to the pdf file. The browser will automatically open the pdf file using a pdf reader software on client machine. Like this:

<iframe src="yourpdffile" style="width:100%;height:500px"></iframe>
Khanh TO
  • 48,509
  • 13
  • 99
  • 115
1

you can't force something on the client for a security issue, but you can check with something like this. My previous sentence follows by the experience that I have on browsers and coding but maybe I can say something wrong.

  1. You can control if there's Adobe Reader using javascript and a code that check if there is the Reader installed with a script like this (I've used these lines months ago and they work)

  2. Try to use this plugin that maybe is for you pourpose (the first sentence link).

Massimo Sedda
  • 47
  • 2
-1

You can also use google docs viewer to achieve this functionality.

Just refer this link : https://docs.google.com/viewer

You can get the iframe url and put it in your site.

<iframe src="http://docs.google.com/viewer?url=http%3A%2F%2Fwww.yoursite.com%2Fpdf%2Ftest.pdf&embedded=true" width="600" height="780" style="border: none;"></iframe>

please note that the value of the url parameter in the src is url encoded.

Check out the JS Fiddle example here

Prabhuram
  • 1,268
  • 9
  • 15