Control PDF using javascript in web browser

I want a frame with a PDF document. The m开发者_Go百科ain document will use javascript to tell the PDF document what page to display and zoom level. Can this be done? If so, how or could you point me to documentation on it. Thanks.

---

You can't/shouldn't do it in a frame, but you can create an <object> on your page that is controllable using the JavaScript API.

http://www.adobe.com/content/dam/Adobe/en/devnet/acrobat/pdfs/js_api_reference.pdf

---

Not easily. It all depends on what's being used to display the PDF in the browser. Not all browsers have built-in PDF viewers, and then there's many different external viewers (e.g. Acrobat, Fox-It, etc...) as well. As far as I know, there's

You can try hacking up the URL like this:

http://example.com/somedocument.pdf#page=5

but this may work in Acrobat only, as documented here: http://partners.adobe.com/public/developer/en/acrobat/PDFOpenParameters.pdf

---

Do you need a PDF reader to be loaded and running? If not, you could write a back end script/program to render a specified page as an image (GIF, PNG, etc.) at a particular zoom level. Then your main page could load an image with something like:

<img src="render_pdf?page=4&zoom=150">

The src value could be controlled with javascript to make it dynamic.

To convert from PDF to an image in your render_pdf script, you can use ghostscript, or an image specific library like ImageMagick or GD, depending on what backend technology you are using.

---

Have a look at jsPDF - it may not output a .pdf onscreen in IE6 and IE7 due to limitations with datauri's, but its a good start. I dont see why this couldnt be built up in an iframe either.

---

As Jordan pointed out, you should use the <object> tag to embed the PDF. Then, in the PDF itself, you need to embed Javascript to handle the messages you pass in, such as:

if(!this.hostContainer.messageHandler) this.hostContainer.messageHandler = new Object();
this.hostContainer.messageHandler.onMessage = handleMessage;
function handleMessage(msg) {
    // do stuff here
}

Finally, in your HTML JS, you pass messages in with:

document.getElementById('yourpdfobject').postMessage('some message or array');