I have a pdf file within iframe. I want user to scroll must in pdf file before submitting the form. i am trying with this,
var position = $('#myIframe').contents().scrollTop();
But not working. Please help me Thanks in advance.
An iframe does not have a scroll method, the document of the iframe does - you need to reference the inner document rather than your <iframe> tag.
All you need to do is add #view=fitH to the end of the source attribute. That's it! fitH stands for fit horizontal, and this will make the PDF in our iframe fit the width of the screen.
Or you can right click anywhere in the PDF and choose Vertical or Horizontal, Single Page or Two Page, tick Continuous Scroll and click Read Mode On or Off from the pop-up menu.
If you don't mind making a static height for your iframe, I have a solution for you.
HTML and CSS
1. Wrap your iframe in a div
container
2. set heights
for both your container and iframe (height
of container should be the height
you want your frame to be seen and the iframe height
should be large enough to show entire pdf.)
3. set container div's overflow
to scroll
Now you have a scrollable "iframe".
Javscript
var containerEl = $("#container")[0];
)scroll
function. Within the scroll function find if the total height of the element (scrollHeight
) is less than or equal to how much has been scrolled (scrollTop
) plus the inner height (clientHeight
) of the
element. If it is, remove disabled
property from button
Here's the fiddle. Made some changes to @mJunaidSalaat's jsfiddle.
Well I've tried almost an hour on this, Researched it, finally coming to a conclusion that Unfortunately this is not possible using this method.
The PDF is usually not a DOM element, it's rendered by PDF reader software. Every browser has its own mechanism for rendering PDFs, there is no standard. In some cases, the PDF might be rendered by PDF.js; in those situations you might be able to detect scrolling. But Adobe Reader, Foxit, and some of the native PDF rendering don't provide that option.
I've also created a Github issue for this. But no use.
Sorry. Please update me if you could find any thing or any workaround.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With