I'm not able to vertically scroll inside the pdftron webviewer for ios devices especially in Safari and other browser?

WebViewer Version: 11.2.0

Do you have an issue with a specific file(s)? PDFs
Can you reproduce using one of our samples or online demos? NO
Are you using the WebViewer server? YES
Does the issue only happen on certain browsers? Safari and in ios devices mostly
Is your issue related to a front-end framework? I think no, I’m using React
Is your issue related to annotations? NO

Please give a brief summary of your issue:
Firstly its working perfectly on android and other devices, now when I am opening a pdf inside the webviewer using pdftron, once the pdf is loaded then I am trying to scroll vertically inside the webviewer and its not getting scrolled down. Like I can see the top of the pdf but not the bottom as well as below pages too. This is happeneing for ios devices safari browser mostly.

1 Like

Hello, I’m AiRon, an automated tech support bot :robot:
While you wait for one of our customer support representatives, I can help you with your question.


It seems like you’re experiencing issues with vertical scrolling in the PDFTron WebViewer specifically on iOS devices using Safari. This could be related to the touch event handling differences between iOS and other operating systems.

Some things you can try:

  • Ensure that the WebViewer container has the correct CSS styles applied, such as overflow: auto or overflow: scroll.

  • Verify that touch events are properly handled by the WebViewer. You might need to add touch-action CSS properties like touch-action: pan-y to enable vertical scrolling.

  • Check if there are any CSS styles or JavaScript libraries in your React application that might interfere with the WebViewer’s default behavior.

  • Make sure that your WebViewer version is compatible with the iOS version you are testing on, as there can be discrepancies in how different versions handle certain features.

  • Consider testing on different iOS browsers to see if the issue is isolated to Safari.



Here are some resources that might help you:

  • WebViewer Basic Usage: This guide provides general setup information that might help ensure your WebViewer is correctly configured.

  • Customizing the WebViewer UI: Learn about customizing the UI, which may include handling touch events for better compatibility on iOS.

  • WebViewer Mobile Support: This documentation provides insights into optimizing WebViewer for mobile devices, including iOS.

  • WebViewer Troubleshooting FAQ: A list of common problems and solutions that might include insights into touch event handling on iOS.



Hopefully, this helps you solve your problem while you wait for a human to get back to you.

1 Like

EnhancedPdfPreview.tsx (40.8 KB)

Here’s my code let me know what’s wrong and how to fix it?

1 Like

Hello Om,

Are you able to reproduce this issue on our Showcase?
I noticed in your code that you are using touchstart and touchmove events. Could you try removing these events to see if you can narrow down the issue? Are you able to provide a sample project I can test with?

Best Regards,
Darian

1 Like

No its working perfectly fine on the showcase one,
I tried removing the touchstart and touchmove events but its still not working on safari browsers in ipad air mini or other ipads.
Yes I can provide a sample project give me some time, in the meanwhile attaching the code without the events.

EnhancedPdfPreview.tsx (38.2 KB)

1 Like