robbestad/react-iframe

PDF in iframe on iPad - only first page is displayed

Opened this issue · 1 comments

k-ahn commented

I am using react-iframe to display a PDF in a React app, however, whereas on a laptop i can scroll through pages of the PDF on an iPad it only displays the first page of the PDF. In more detail:

On a windows laptop (Chrome and Firefox tested):

  • Open React App
  • Click to render react-iframe
  • WORKS AS EXPECTED: react-iframe displays all pages of a multi-page PDF from URL
  • user can scroll through pages in PDF within the iframe

On an iPad (Chrome and Safari tested):

  • Open React App
  • Click to render react-iframe
  • ISSUE: react-iframe displays only the first page of a multi-page PDF from URL
  • user can scroll through page 1 only

For debugging i accessed the same PDF URL directly in Safari on the iPad - this worked and i could scroll through all pages. I've also tested with multiple PDF files - all the same.

Code is:

<Iframe url={url}
width="100%"
height="100%"
display="initial"
position="relative"/>

Seeing the same issue on the iPhone X.

Code is:

<Iframe url={pdf} width='100%' height='800px' id='test title' display='initial' position='relative' />