I asked a similar question to this a week ago but perhaps I did not make the question clear enough.
I have since been struggling to find something that works, but without success.
Using the latest version of all the mon browsers I want to display a PDF opened on a specific page.
Using Chrome - Does what I want :-)
Pressing the button opens the PDF on page 3. If the user scrolls the pdf to a different page and then re-presses the button the PDF opens again on page 3;
Using FF,IE or Safari
Pressing the button opens the PDF on page 3. If the user scrolls the pdf to a different page and then re-presses the button nothing happens.
Does anyone know how I can get the page to always open on page 3 with all the latest browsers? I am more than happy to pletely change my approach, including using a free plugin if necessary.
If anyone knows that what I am trying to do can ONLY be done in Chrome then I would be grateful if they could let me know.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ".dtd">
<html xmlns="">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Test for SO</title>
<script src="Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>
</head>
<body>
<input id="test" value="Test" type="button" />
<br />
<iframe id="iFrame" width="500" height="600"></iframe>
</body>
</html>
<script type="text/javascript">
$(function () {
$("#test").click(function () {
var fileName = "/PDFFiles/pages.pdf#page=3";
$('#iFrame').attr("src", fileName);
});
});
</script>
I asked a similar question to this a week ago but perhaps I did not make the question clear enough.
I have since been struggling to find something that works, but without success.
Using the latest version of all the mon browsers I want to display a PDF opened on a specific page.
Using Chrome - Does what I want :-)
Pressing the button opens the PDF on page 3. If the user scrolls the pdf to a different page and then re-presses the button the PDF opens again on page 3;
Using FF,IE or Safari
Pressing the button opens the PDF on page 3. If the user scrolls the pdf to a different page and then re-presses the button nothing happens.
Does anyone know how I can get the page to always open on page 3 with all the latest browsers? I am more than happy to pletely change my approach, including using a free plugin if necessary.
If anyone knows that what I am trying to do can ONLY be done in Chrome then I would be grateful if they could let me know.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Test for SO</title>
<script src="Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>
</head>
<body>
<input id="test" value="Test" type="button" />
<br />
<iframe id="iFrame" width="500" height="600"></iframe>
</body>
</html>
<script type="text/javascript">
$(function () {
$("#test").click(function () {
var fileName = "/PDFFiles/pages.pdf#page=3";
$('#iFrame').attr("src", fileName);
});
});
</script>
- Maybe you can give a reference to your other question. Or you could have editted your other question to make it more clear? – Bernhard Commented Mar 25, 2012 at 9:52
- Are you saying that people would notice that I had edited my question? I did not know that, I will do that in future. Thank you for the information. In my past experience, people sometimes respond with a guess or something unhelpful like "Why do you want to do that", and then no one else bothers. Can you help me with my problem? stackoverflow./questions/9717993/… – Pete Davies Commented Mar 25, 2012 at 10:04
- I think only Adobe PDF plugin supports the page parameter. <code><a href="example./sample_doc.pdf?page=3">Page 3 in sample_doc.pdf</a></code> You can also <a href="gnostice./… a PDF action to the document so that it opens a particular page</a>. I have shown how to do this using our product PDFOne .NET but you can add the PDF action using any other tool. – BZ1 Commented Mar 26, 2012 at 7:33
- @PeteDavies please select the best answer. – Adam Friedman Commented Jan 18, 2015 at 1:18
4 Answers
Reset to default 3This works for Chrome
<A HREF="http://www.example./myfile.pdf#page=4">
To make this work in all Browsers, PDF has to be coded to open to a specific page.
This can be done using Adobe Acrobat.
Try using Google's document viewer as follows:
<iframe src="http://docs.google./gview?url=http://infolab.stanford.edu/pub/papers/google.pdf&embedded=true" style="width:100%; height:500px;" onload="javascript:this.contentWindow.location.hash='#:0.page.4';" frameborder="0"></iframe>
The essential part is the onload function which adds the zero-based index page number to show:
onload="javascript:this.contentWindow.location.hash='#:0.page.4';"
If you need a button to make the iframe reload, just update the iframe src (I think that's the easiest method, but I may be wrong):
$('button').click(function(){
$('iframe').attr("src", function() {
return this.src;
});
});
my suggestion is to set the iframe src to something else, then back at the correct document. for a short time only.
You need to destroy and re-create the iframe node itself. For example:
<input id="test" value="Test" type="button" />
<br />
<div id="wrapper">
<!-- iframe will be continually destroyed and re-created here -->
</div>
<script type="text/javascript">
// Create the initial iframe on page load
$('<iframe id="iFrame" width="500" height="600" src="/PDFFiles/pages.pdf">').appendTo('#wrapper');
// Destroy and recreate iframe on button click, starting on your desired page.
$("#test").click(function () {
if($('#iFrame').length) {
$('#iFrame').remove();
}
var page = 3;
$('<iframe id="iFrame" width="500" height="600" src="/PDFFiles/pages.pdf#page='+page+'">').appendTo('#wrapper');
});
</script>
Note: There will be a moment in which the PDF loads again on the first page, but you may be able to hide it under an ajax loader ball for a 1-2 seconds, then by the time you make it visible it will have jumped to your desired page.