I'm trying to use PDF.js' viewer to display pdf files on a page.

I've gotten everything working, but I would like to be able to 'jump to' a specific page in the pdf. I know you can set the page with the url, but I would like to do this in javascript if it's possible.

I have noticed that there is a PDFJS object in the global scope, and it seems that I should be able to get access to things like page setting there, but it's a rather massive object. Anyone know how to do this?

I'm trying to use PDF.js' viewer to display pdf files on a page.

I've gotten everything working, but I would like to be able to 'jump to' a specific page in the pdf. I know you can set the page with the url, but I would like to do this in javascript if it's possible.

I have noticed that there is a PDFJS object in the global scope, and it seems that I should be able to get access to things like page setting there, but it's a rather massive object. Anyone know how to do this?

• javascript
• jquery
• asp.net-mvc
• pdf
• pdf.js

3 Answers 3

You can set the page via JavaScript with:

var desiredPage = [the page you want];
PDFViewerApplication.page = desiredPage;

There is an event handler on this, and the UI will be adjusted accordingly. You may want to ensure this is not out of bounds:

function goToPage(desiredPage){
    var numPages = PDFViewerApplication.pagesCount;
    if((desiredPage > numPages) || (desiredPage < 1)){
        return;
    }
    PDFViewerApplication.page = desiredPage;
}

if Pdf shown into iframe and you want to navigate to page then use below code. 'docIfram' is iframe tag Id.

document.getElementById("docIframe").contentWindow.PDFViewerApplication.page=2

In my case I was loading pdf file inside iframe so I had to do it in other way around.

function goToPage(desiredPage){
var frame_1 = window.frames["iframe-name"];
var frameObject = document.getElementById("iframe-id").contentWindow;
frameObject.PDFViewerApplication.page = desired page;
}