How to resize a displayed pdf using html

  • I have a pdf (an order form) that is linked to a particular word in my page text. When the user clicks on the word, it displays a new window containing the pdf order form. Currently, it fills the screen width-wise causing the user to have to scroll to see the entire form. I’d like to make it fit the screen length-wise so that the entire form is visible. I realize that different users have different monitor resolutions, so this may not be easy. I use Windows 8, so I can press Ctrl + – to make the screen content smaller, but I’d like to make it be screen size upon initial display for the user without having them do anything.

    Thanks in advance,

    Jim

    The blog I need help with is https://www.jfowlerphotography.com.

Viewing 2 replies - 1 through 2 (of 2 total)

  • You could embed the pdf inside a page. This would give you more control over the size and behavior of the display of the form. I was unable to open the url you provided, https://www.jfowlerphotography.com. to view your form.

    Here is a link that describes different ways to embed a pdf

    Using this information from link, I added a pdf to a page for testing:

    <style type="text/css">
<!--
#pdf {
	width: 90%;
	height: 600px;
	margin: 2em auto;
	border: 10px solid #6699FF;
}

#pdf p {
   padding: 1em;
}

#pdf object {
   display: block;
   border: solid 1px #666;
}

-->
</style>
<div id="pdf">
<object data="https://.fullurl.to.your.pdf#toolbar=1&navpanes=0&scrollbar=1&page=1&view=FitW"" type="application/pdf" width="100%" height="100%" >
<p>It appears you don't have a PDF plugin for this browser. No biggie... you can <a href="/pdf/sample.pdf">click here to download the PDF file.</a></p>
</object>
</div>

    Thread Starter jimf29605

    (@jimf29605)

    Thanks, jc62. I’ll give it a shot.

    Jim

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘How to resize a displayed pdf using html’ is closed to new replies.